چرخش عکس با css3

[s2s2x]

این کد باعث می شه که با قرار گرفتن موس روی عکس ، عکس بچرخه یا بزرگنمایی (scale) بشه .
با قرار دادن این کد در هدر(در تمامی صفحات) یا ایندکس (فقط در صفحه اول) این کار رو میشه انجام داد.

کد php:

<style type="text/css">
.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);
}
</style> 


سپس قرار دادن عکس.هرجا خواستین به نمایش در بیاد کد رو کپی کنید.

کد php:

<div class="itemp">
    <img src="لینک عکس"></img>
 </div> 


نمونه تو تالارم هست .
یادتون باشه تو notepad کپی کنید بعد از کدها استفاده کنید
امید وارم مطلب تکراری نباشه.

[f.gh1372]

ممنون .
شرمنده . من زیاد وارد نیستم ! الان برای انجام دادن این حالت روی کد هدر این کد ها رو باید بذارم توی هدر و لینک عکس هدر را بهش بدم ؟ یا جور دیگه ؟

[s2s2x]

بله .
با قرار دادن این کد در هدر (به همراه لینک عکس) لوگوی یا عکس مورد نظر در تمام صفحات به نمایش(به همراه ایفکت چرخش) در می آید.

[f.gh1372]

سپاس فراوان . درست شد

[adnan]

یه پیشنهاد!
از روش یه مای کد درست کنید خیلی خوب میشه!