كيفية اضافة تأثير الدوران على الصور لمدونات بلوجر مضيفا تأثير مختلف بطريقة رائعة ، فهي تعطي جمالية لصورك و يوجد الكثير من التأثيرات على الصور لذلك في هذا الدرس سوف نتعلم ففط عمل تأثير الدوران على الصور و يمكن وضع اكثر من صورة في الموضوع اضغط على معاينة لرؤية التأثير
طريقة التركيب
الان ابحث عن ]]></b:skin> و اضف الكود التالي فوقه
.spinningeffect img {
/* Spinning Social Icons Widget By www.mudwnp.blogspot.com */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}
.spinningeffect img:hover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
اهم الملاحظات حول الكود
يمكنك أيضا تغيير درجة دوران الصور استبدل 360deg, ستجدها مكررة اكثر من مرة استبدلها كلها
كيفية وضع الصور في الموضوع
عند كتابة موضوع جديد انتقل إلى وضع HTML
و قم بلصق هذا الكود في وضع HTML
<a class="spinningeffect" href="YOUR-IMAGE-URL/" target="_blank">
<img src="http://YOUR-IMAGE-URL" /></a>
الان لتطبيق تأثير الدوران على الصور
استبدل YOUR-IMAGE-URL برابط الصورة و يمكنك تكرار الكود كما تريد في الموضوع
يمكنك ايضا مشاهدة : اضافة تأثير الدوران على الصور لمدونات بلوجر
تحياتي
مدون محترف
No comments:
Post a Comment