Blood

کد o-transition.moz-transition.ms-transition.webkit-transition

8 پست در این موضوع قرار دارد

با سلام من از کد زیر برای کند کردن mouse hover روی یک div استفاده میکنم


-webkit-transition: background 0.2s linear;
-moz-transition: background 0.2s linear;
-ms-transition: background 0.2s linear;
-o-transition: background 0.2s linear;
transition: background 0.2s linear;

وقتی بک گراند div از عکس استفاده میکنه دیگه وقتی موس میره روش اسلو نمیشه مشکل چیه؟

ویرایش شده در توسط M.At
0

به اشتراک گذاری این پست


لینک به پست

عکس فقط در نمایشگر های وب کیت این خاصیت رو قبول می کنه (سافاری و گوگل کروم) مگر اینکه background-size تغییر کنه

1

به اشتراک گذاری این پست


لینک به پست

استاد فخار به نظر شما به چه صورت این منو رو درست کنم منوی آبی رنگ منظورم که در لینک زیر هست؟

http://www.templatemonster.com/demo/45593.html

منویی که مشاهده میکنید اول عکس هست وقتی با موس روی منو میریم بعد تبدیل به رنگ میشه و خیلی تقریبا اسلو هست به چه صورت این منو رو ایجاد کنم ؟

0

به اشتراک گذاری این پست


لینک به پست

لینکگی که دادید همه منوهاش آبی بود ولی من متوجه عکس نشدم

برای تبدیل آهسته عکس به رنگ


.nav li {
height:45px;
background:#369 url('images/bg.png') repeat-x scroll left 0%;
background-size:auto 45px;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out;
}
.nav li:hover {
background-position:left 100%;
background-size:auto 0px;

}

1

به اشتراک گذاری این پست


لینک به پست

این منو رو منظورم هست استاد

و روی هر منو کلیک میکنید در هر صفحه که باشه رنگ منوی اون صفحه آبی پر رنگ میشه مثلا در صفحه BLOG باشیم رنگ منوی اون به آبی پر رنگ تبدیل میشه ؟ این عمل رو هم لطفا بگید باید چه کاری انجام بدم؟ ببینید من از اون کدی که دادیداستفاده کردم اما من میخوام به صورت اسلو شده عکس تغییر کنه منو رو خودتون مشاهده کنید متوجه میشید از اون کد استفاده کردم فقط در کروم نشون میده در فایر فاکس نمایش نمی ده به صورت اسلو در فایر فاکس باید دوتاشون رنگ باشن تا به صورت اسلو تغییر کنه این کدی که من استفاده میکنم


nav li > ul,
nav li > ol {
margin:0;
list-style: none;

}
.main-navigation {
float: right;
}
.main-navigation li {
float:right;
font-family: 'Lato', sans-serif;
}
.main-navigation ul li a {
font-size: 15px;
text-align:center;
color: #fff;
}
.main-navigation li.default-menu,
li.default-menu {
display: none;

}
.main-navigation a {
background: transparent url(images/Menu-Image.png) no-repeat top center;
background-color:#89D2FD;
width:189px;
float: right;
display: block;
line-height:70px;
margin: 0 0px 0 0px;

}
.main-navigation a:hover,
.main-navigation ul li.current-menu-item a,
.main-navigation ul li.current_page_ancestor a,
.main-navigation ul li.current-menu-ancestor a,
.main-navigation ul li.current_page_item a,
.main-navigation ul li:hover > a {
background: url(images/Menu-Image-hover.png) no-repeat top center;
background-color:#248FCA;
width:189px;
line-height:70px;
-webkit-transition: background 0.3s linear;
-moz-transition: background 0.3s linear;
-ms-transition: background 0.3s linear;
-o-transition: background 0.3s linear;
transition: background 0.3s linear;

}

12.jpg

ویرایش شده در توسط M.At
0

به اشتراک گذاری این پست


لینک به پست

http://cdpn.io/ucaxj

بستگی به نحوه استفاده شما داره و الا عمل می کنه

سئوال دومتون رو در تایپیک جدا بپرسید مبحثش کاملا جداست

0

به اشتراک گذاری این پست


لینک به پست

این صفحه ای که شما دادید عمل میکنه؟ درسته آیا از کد من استفاده کردید؟ یا کدی که خودتون گداشته بودید؟ اما برای من به صورت اسلو نیست نمی دونم چرا؟ چه کاری باید انجام بدم تا بفهمم مشکل چیه؟

میشه این صفحه ای که دادی رو کدش رو قرار بدید؟ شاید من یک جا اشتباهی کردم که برای من به نمایش در نمی یاد

ویرایش شده در توسط M.At
0

به اشتراک گذاری این پست


لینک به پست

زیر صفحه روی editpen بزنید و کدها را ببینید با دو کد مختلف ساخته شده خط بالا با تصویره و خط پایین با کدهای css

https://gist.github.com/anonymous/05f98a05eec9701b2998

1

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری