درود دوستان. بنده میخوام وقتی ماوس روی لوگوم قرار میگیره لوگو آهسته حول محور مرکزی خودش بچرخه. یعنی چرخش 360 درجه اما متوقف نشه. برام مهمه که آهسته بچرخه و سرعت چرخش رو بتونم دست کاری کنم. لطفا کد css چنین کاری رو برام بزارید. سپاس از شما
کد : -moz-transition: all 1s ease 0s; برای آروم چرخیدن هست که میتونید ثانیشو کمو زیاد کنید از 1s و کد دوم یعنی -moz-transform: rotate(180deg); برای چرخش هست که باز هم میتونید کمو زیاد کنید از 180 مثلاً به 360
سرعتش کم و زیاد نمیشه اصلا. قبلا این کد رو هم استفاده کردم اما میخوام اصلا ایست نکنه. اصلا رفتن ماوس روی لوگو بیخیال.. میخوام به محض که صفحه باز میشه لوگو همینطور آروم بچرخه. چنین کدی داریم؟
این کد هم هست برای این چیزی که شما گفتید ولی نمیدونم چطور سفارشی کنم بصورتی که میخوام
[CSSS]
.itemp{
transition-property:transform;
transition-duration:1s;
-moz-transition-property:-moz-transform;
-moz-transition-duration:1s;
-webkit-transition-property:-webkit-transform;
-webkit-transition-duration:1s;
-o-transition-property:-o-transform;
-o-transition-duration:1s;
z-index:10
}
.itemp :hover{
opacity:1;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-moz-transform: scale(1.1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
-webkit-transform: scale(1.1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
-o-transform: scale(1.1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
-ms-transform: scale(1.1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
transform: scale(1.1) rotate(360deg) translate(0px, 0px) skew(0deg, 0deg);
}
[/CSSS]
چیزی که شما میخواید باید جی کوئری هم استفاده کنید برای اینکه صفحه لود شد بچرخه .
ولی من دقیق منظورتونو نفهمیدم از این که ایست نکنه !
وقتی نشانه گر میره روی عکس لوگوی شما 360 درجه میچرخه و این که بخواد همینجوری بچرخه فک نمیکنم جالب باشه .
بعد ببینید من کد سی اس اس که دادم گفتم #logo : این آیدی هست که من به img دادم یعنی :
[HTMLS]<img id="logo" src"..."[/HTMLS]
و اومدم تو سی اس اس logo:hover دادم ولی اگر شما به صورت یک دیو میدادی به این صورت میشد :
[HTMLS]<div id="logo"[/HTMLS]
و :
[HTMLS]#logo img {
-moz-transition: all 1s ease 0s;
}
#logo img:hover {
-moz-transform: rotate(180deg);
}[/HTMLS]
بله میخوام دائم بچرخه.. یا با رفتن ماوس روش متوقف بشه.. و یا متوقف باشه و با رفتن ماوش روی اون بچرخه.. خب فکرنکنم وقتی یه لوگو قابلیت داشته باشه که از همه طرف یه مفهمو رو بده، عیبی داشته باشه که بچرخه دائم. اما خیلی مهم هست برام که آهسته چرخش کنه.
این هم آپلودش: http://melody-ins.com/test/test.html
خیلی سپاس.. عالی هست. خیلی لطف کردی رفیق. اگر تو سایت زیبات خدمتی هم از دست بنده بر بیاد در خدمتم تا کمی از لطفت رو جبران کنم.
فقط یه سوال.. آیا میشه بدون اینکه ماوس رو روش بگیریم خودش چرخش رو به محض لود شدن صفحه شروع کنه؟
با css فک نمیکنم ولی با js میشه که باید بشینم کدش رو براتون بنویسم .
در سایت هم اگر تمایل دارید میتونید یکی از نویسنده های سایت ما باشید و مطالبتون رو به اشتراک بزارید تا طراحان و برنامه نویسان دیگری هم با شما آشنا شوند .
اگر هم دوست دارید میتونید به صورت کاربر مهمان فعالیت کنید و از بخش ارسال مطلب مطالبتون رو ارسال کنید .
سپاس از مهر شما
بنده در خدمت هستم. اگر مایل باشید کمی از فتوشاپ سر رشته دارم که در این زمینه مطلب خواهم گذاشت. ثبت نام میکنم.
با نام کاربری
ahora
ثبت نام کردم
