معهد خبراء بلوجر - كيف جعل الصورة تدور 360درجة عند مرور الماوس عليها |swe-up

كيف جعل الصورة تدور 360درجة عند مرور الماوس عليها |SWE-UP
http://2.bp.blogspot.com/-t5nnOyGP7s...8%B4%D8%B1.jpg
في هذا الشرح السريع سوف نجعل صورة المشاركات الشائعة في مي مدونتك تدور 360 درجة بمجرد مرور مؤشر الماوس عليها وهذا سيظفي جانب جمالي مع بعض المتعة لزوار مدونتك ,دعونا نبدأ الشرح
أولا :عليك تركيب المشاركات الشائعة اذا لم تكن موجودة في مدونتك وأعتقد ان الأمر سهل واي مشكلة اترك تعليق ونساعدك
ثانيا : عليك التسجيل في بلوجر>>قالب>>تحريرHTML>>نضع مؤشر الماوس في اي مكان داخل القالب>>نظغط Ctrl+F
ثم نبحث عن هذا الوسم ]]></b:skin> ونلصق الكود التالي فوقه مباشرة

كود بلغة HTML:

<style type='text/css'>

.PopularPosts .item-title{display:none}

.PopularPosts ul li {background: none repeat scroll 0 0 transparent;float: left;list-style: none outside none;margin: 5px !important;padding: 0 !important;}

.PopularPosts ul li img {padding:0;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;height: 80px;width: 80px;}

.PopularPosts ul li img:hover {border:2px solid #BBB;-moz-transform: scale(1.2) rotate(-1090deg) ;-webkit-transform: scale(1.2) rotate(-1090deg) ;-o-transform: scale(1.2) rotate(-1090deg) ;-ms-transform: scale(1.2) rotate(-1090deg) ;transform: scale(1.2) rotate(-1090deg) ;}

</style>

حفظ القالب ومبارك عليك الاضافة

لا تنسانا من دعائك وكما استفدت من التدوينة اجعل أصدقائك يستفيدوا بمشاركة التدوينة عبر مواقع التواصل الاجتماعي او حتى عبر زر انقل هذه التدوينة لمدونتك كما يشرفنا ان تنضم لمدونتي في الجانب الأيسر صندوق انضم للموقع حتي يصلك كل جديد واي مشاكل تواجهها يمكنك ترك تعليقك أسفل التدوينة كما يمكنك ترك تعليق لتشجيعنا على الاستمرار
تحذير : ممنوع نقل الموضوع بدون ذكر المصدر مرفقا برابط الموضوع
هنا المصدر http://swe-up.blogspot.com/2014/04/How-to-make-the-image-rotates-360degrees-when-the-mouse-hovers.html