طريقة جعل الصور شفافة فى مدونة بلوجر

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

زوار مدونة عرب فرتكة الكرام 

نقد لكن اليوم طريقة رائعة لجعل الصور فى المنشورات 

شفافة قليلاً وعند الوقوف عليها بالمواس ترجع اىل شكلها الطبيعي 

مثال 

وطريقة عمل ذلك كالتالي

1 - من لوحة البلوجر " نضغط على قالب".

2 - توجه إلى تخطيط .

3 - انقر فوق زر تحرير HTML .

4 - قم بالبحث فى القالب عن ]]></b:skin>.

عن طريق الضغط على ctrl + f ثم ضع الكود المراد البحث عنه فى المربع ثم اضغط enter

5 - ثم قم بلصق الكود التالي قبلها مباشرةً :

img.hovereffect {
 opacity: 0.5;
 -webkit-transition: all .3s linear;
 -moz-transition: all .3s linear;
 -o-transition: all .3s linear;
 transition: all .3s linear;
}
img.hovereffect:hover {
 opacity: 1;
}

6 - قم بحفظ القالب
الآن كل ما تبقى لك هو إضافة class="hovereffect" لصورك. على سبيل المثال، عند إضافة صورة صندوق كتابة المنشور بالمدونة في وضع HTML ستبدو:

<div class="seperator" style="clear: both;">
<a href="http://the-image.jpg"><img height="240" src="http://the-image.jpg" width="320" /></a>
</div>

ولكن، لإضافة هذا التأثير، تحتاج إلى إضافة فئة كما هو مبين أدناه:

<div class="seperator" style="clear: both;">
<a href="http://the-image.jpg"><img height="240" class="hovereffect" src="http://the-image.jpg" width="320" /></a>
</div>

اتمني ان ينال المنشور اعجابك