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

Share

بسم الله الرحمن الرحيم

السلام عليكم ورحمة الله .
================

المعاينة من هنا (قد يظهر التأثير أجمل على مدونتك)

نبدأ على بركة المولى ::


أولا :
نقوم بالتالي

مهم : التخطيط ==> تحرير HTML ونقوم بتحميل نسخة عن القالب (احتياطا)

والآن نتوجه إلى : لوحة التحكم ==> التخطيط ==> تحرير html

نقوم بتوسيع القالب :

والآن نبحث (Ctrl + F) عن الكود التالي :  </head>


والآن ألصق الكود التالي فوق الكود السابق (الأحمر) :

تنبيه: تأكد من نسخ الكود كاملاً :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".post img").fadeTo("slow", 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(".post img").hover(function(){
$(this).fadeTo("slow", 0.5); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script>
<script type='text/javascript'>
$(document).ready(function(){
$(".latest_img").fadeTo("slow", 1.0); // This sets the opacity of the thumbs to fade down to 30% when the page loads
$(".latest_img").hover(function(){
$(this).fadeTo("slow", 0.5); // This should set the opacity to 100% on hover
},function(){
$(this).fadeTo("slow", 1.0); // This should set the opacity back to 30% on mouseout
});
});
</script>

إضغط "معاينة" إذا نجحت الطريقة فقم "بالحفظ"

والسلام عليكم ورحمة الله .

الشرح بالفيديو :