JavaScript is not enabled!...Please enable javascript in your browser

جافا سكريبت غير ممكن! ... الرجاء تفعيل الجافا سكريبت في متصفحك.

اضافة تأثير الدوران على الصور لمدونات بلوجر

اضافة تأثير الدوران على الصور لمدونات بلوجر

#CSS
0
(0)
author-img
نجم تهامه
كيفية اضافة تأثير الدوران على الصور لمدونات بلوجر


كيفية اضافة تأثير الدوران على الصور لمدونات بلوجر مضيفا تأثير مختلف بطريقة رائعة ، فهي تعطي جمالية لصورك و يوجد الكثير من التأثيرات على الصور لذلك في هذا الدرس سوف نتعلم ففط عمل تأثير الدوران على الصور و يمكن وضع اكثر من صورة في الموضوع اضغط على معاينة لرؤية التأثير




طريقة التركيب


الان ابحث عن ]]></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 برابط الصورة و يمكنك تكرار الكود كما تريد في الموضوع

يمكنك ايضا مشاهدة : اضافة تأثير الدوران على الصور لمدونات بلوجر 

تحياتي 
مدون محترف
NameE-MailNachricht

Dieses Blog durchsuchen
"0" title="Advertisement" aria-label="Advertisement" style="border: none; height: 300px; width: 600px; margin: 0px; padding: 0px; position: relative; visibility: visible; background-color: transparent; display: inline-block; overflow: visible;">
google-playkhamsatmostaqltradent