چرخش خودکار عکس با css

[temptation 10]

سلام دوستان من یه عکس دارم که میخوام با کد css یا js به طور خودکار بچرخه هر چی جستجو کردم چیزی پیدا نکردم کدهای css ای هم که بود فقط برای hover بود من میخوام به صورت خودکار بچرخه ممنون میشم اگه دوستان کسی بتونه راهنمایی کنه

[mmfallah 67]

از این کد استفاده کنید

#div2 {
 -webkit-animation-name: rotateThis;
 -webkit-animation-duration:2s;
 -webkit-animation-iteration-count:infinite;
 -webkit-animation-timing-function:linear;
}
@-webkit-keyframes rotateThis {
 from {-webkit-transform:scale(0.5) rotate(0deg);}
 to {-webkit-transform:scale(0.5) rotate(360deg);}
} 

توی div2 عکس را لود کنید

[temptation 10]

از این کد استفاده کنید

#div2 {
 -webkit-animation-name: Rotatethis;
 -webkit-animation-duration:2s;
 -webkit-animation-iteration-count:infinite;
 -webkit-animation-timing-function:linear;
}
@-webkit-keyframes rotatethis {
 from {-webkit-transform:scale(0.5) rotate(0deg);}
 to {-webkit-transform:scale(0.5) rotate(360deg);}
} 

توی div2 عکس را لود کنید

ممنون دوست عزیز بابت راهنماییتون کدو گذاشتم توی کروم کار میکنه ولی توی موزیلا و ie کار نمیکنه ممنون میشم راهنمایی کنید و اینکه اگه بخوام جهت چرخشش رو عوض کنم چیکار باید بکنم؟

[mmfallah 67]

برای موزیلاو ie باید تگ هاشون را اضافه کنید به ابتدای کد

-moz-

-o-

[temptation 10]

برای موزیلاو ie باید تگ هاشون را اضافه کنید به ابتدای کد

-moz-

-o-

ممنون دوست عزیز بابت راهنماییتون من این هارو اضافه کردم ولی باز نشون نمیده !!!:21:و برای جهت چرخشش باید چیکار کنم ؟شرمنده من تازه کارم هی سوال میپرسم

[mmfallah 67]

این کد را آزمایش کنید

#div2 {
 -webkit-animation-name: Rotatethis;
 -webkit-animation-duration:2s;
 -webkit-animation-iteration-count:infinite;
 -webkit-animation-timing-function:linear;

 -moz-animation-name: Rotatethis;
 -moz-animation-duration:2s;
 -moz-animation-iteration-count:infinite;
 -moz-animation-timing-function:linear;
}
@-webkit-keyframes rotatethis {
 from {-webkit-transform:scale(0.5) rotate(0deg);}
 to {-webkit-transform:scale(0.5) rotate(360deg);}
}

@-moz-keyframes rotatethis {
 from {-moz-transform:scale(0.5) rotate(0deg);}
 to {-moz-transform:scale(0.5) rotate(360deg);}
}

[temptation 10]

این کد را آزمایش کنید

#div2 {
 -webkit-animation-name: Rotatethis;
 -webkit-animation-duration:2s;
 -webkit-animation-iteration-count:infinite;
 -webkit-animation-timing-function:linear;

 -moz-animation-name: Rotatethis;
 -moz-animation-duration:2s;
 -moz-animation-iteration-count:infinite;
 -moz-animation-timing-function:linear;
}
@-webkit-keyframes rotatethis {
 from {-webkit-transform:scale(0.5) rotate(0deg);}
 to {-webkit-transform:scale(0.5) rotate(360deg);}
}

@-moz-keyframes rotatethis {
 from {-moz-transform:scale(0.5) rotate(0deg);}
 to {-moz-transform:scale(0.5) rotate(360deg);}
}

ممنون از راهنماییتون دوست عزیز ولی باز هم در موزیلا و ie کار نمیکنه

[mmfallah 67]

نمونه ای که درست کردم را براتون پیوست کردم که ببینید.

توی هر 3 مرورگر هم کار میکنه

css3-rotate دانلود ● آپلود سنتر انجمن جوملای ایران

[temptation 10]

نمونه ای که درست کردم را براتون پیوست کردم که ببینید.

توی هر 3 مرورگر هم کار میکنه

css3-rotate دانلود ● آپلود سنتر انجمن جوملای ایران

درست شدددددددددددددددgift ممنون دوست عزیز فقط اگه بخوام به صورت افقی بچرخه چه درجه ای باید بهش بدم؟

[mmfallah 67]

برای چرخش به صورت افقی کدش فرق می کنه و نمیتونید با تغییر این کد درستش کنید

[temptation 10]

برای چرخش به صورت افقی کدش فرق می کنه و نمیتونید با تغییر این کد درستش کنید

شرمنده دوست عزیز میتونید یه راهنمایی کنید راجع به اون کدها چون من میخوام که در این سمت بچرخه :33: