اولا المثال كما في مدونتي مثل الصورة التاليه :
والان ناتي لطريقة التركيب:
سجل دخول الي لوحة التحكم ثم اذهب الي تصميم الصفحه ومن ثم تحرير HTML .
ثم قم بالبحث عن img { ظلل ماهو موجود تحته كما في الصوره:
ثم ضع مكانه الكود الموجود بالاسفل:
-webkit-transition-duration:.4s;border-radius:13px;}
img:hover {filter: alpha(opacity=60);
opacity: .6;
border-radius:13px;
border: 1px #3B5998;
-webkit-box-shadow: 0px 0px 20px #3B5998;
-moz-box-shadow: 0px 0px 20px #3B5998;
}
للتعديل علي الكود بما يناسب مدونتك قم بتغيير #3B5998 الي اي درجه لونية تراها مناسبه ستجدها مكرره 3 مرات قم بتغييرهم جميعا ويمكنك الاستعانه بجدول اكواد الالوان الموجود في مدونتي ستجد فيه جميع الدرجات اللونيه من هنا.. للتحكم في استدارة الصور غير الرقم 13 داخل الكود. تراه موجود مرتين قم بتغييرهم كل علي حدا باي رقم ترغب فيه
ملحوظه: كلما زاد الرقم تزيد الاستداره والعكس صحيح ...
تاثير اخر يجعل الصوره في وضعها الطبيعي تكون ذات الوان خافته وحين المرور عليها تتضح بلونها الطبيعي ولتطبيق ذلك .
لا تقم بعمل الخطوات السابقه بل قم بالبحث عن
]]></b:skin>
وضع بعدها مباشرة الكود التالي:
ثم حفظ القالب ..
<style type='text/css'>
img {
filter:alpha(opacity=200);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 1.5;}
img:hover {
filter:alpha(opacity=100);
-moz-opacity: 2.0;
opacity: 1.0;
-khtml-opacity: 2.0; }
</style>
وتم الانتهاء
استودعكم الله
أصدقاء(طوق حياه)
1تعليقات Blogger
