الصورة تعبر عن الكثير من الكلام وتوفر العديد من الشروحات ولذلك بعد التدوينات السابقة عن التأثير على الصور بعنوان خمسة تأثيرات مذهلة على صور مدونتك .. لا تفوتك وكذلك التدوينة الخاصة بعمل تضخيم للصورة بمجرد المرور عليها. جئنا اليوم بتأثير جديد يجعل من صور تدويناتك وكأنها ثلاثية الأبعاد.
يمكنك معاينة التأثير من هنا (مدونة تجريبية) . اذا اعجبك التأثير يمكنك نسخ الكود التالي:
/* CSS Image Morph http://www.abu-iyad.com */
.post img{border:10px solid #fff;overflow:hidden;-webkit-box-shadow:5px 5px 5px #111;box-shadow:5px 5px 5px #111;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;-ms-transition:all .5s ease;transition:all .5s ease;margin:20px}
.post img:hover{border-radius:50%;-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}
/* CSS Image Morph http://www.abu-iyad.com */
طريقة وضع الكود لتفعيل التأثير كالتالي:
1- الدخول على لوحة التحكم ثم القالب Template ثم اختر تخصيص Customise
2- اختار متقدم Advanced ثم Add CSS وضع الكود السابق فى المستطيل3- إضغط على Apply to Blog
إرسال تعليق
جميع الردود تعبّر عن رأي كاتبيها فقط. حريّة النقد والرد متاحة لجميع الزوار بشرط أن لا يكون الرد خارج نطاق الموضوع وأن يكون خال من الكلمات البذيئة. تذكّر قول الله عز وجل (مَا يَلْفِظُ مِن قَوْلٍ إِلاَّ لَدَيْهِ رَقِيبٌ عَتِيد).
EmoticonClick to see the code!
To insert emoticon you must added at least one space before the code.