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

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

الكاتب : admin التاريخ : السبت، 7 يناير 2017 التعليقات : 0

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

السلام عليكم و رحمة الله تعالى و بركاته .
اليوم سأقدم لكم إضافة جميلة جدا و هي إضافة تأثير العومان إلى لوجو مدونتكم بلوجر ، بحيث كل ما يمر الزائر بالفأرة على اللوجو سيتحرك و هذا ما يدل على إحترافية التصميم و يزيد في جمال الموقع .

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

1. إذهب الى تحرير القالب HTML ، ثم إضغط Ctrl+f من لوحة المفاتيح و إبحث عن وسم  ]]></b:skin>
2. بعد أن تجد الوسم ، ضع الكود التالي قبله (فوقه) مباشرة : 

 #header h1 a:hover{
/*animation*/
-webkit-animation:jelly .5s;
   -moz-animation:jelly .5s;
    -ms-animation:jelly .5s;
     -o-animation:jelly .5s;
        animation:jelly .5s;
}
#header img:hover{
/*animation*/
-webkit-animation:jelly .5s;
   -moz-animation:jelly .5s;
    -ms-animation:jelly .5s;
     -o-animation:jelly .5s;
        animation:jelly .5s;
}
@-webkit-keyframes jelly{
from,to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}25%{-webkit-transform:scale(.9, 1.1);transform:scale(.9, 1.1)}50%{-webkit-transform:scale(1.1, .9);transform:scale(1.1, .9)}75%{-webkit-transform:scale(.95, 1.05);transform:scale(.95, 1.05)}
}
@keyframes jelly{
from,to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}25%{-webkit-transform:scale(.9, 1.1);transform:scale(.9, 1.1)}50%{-webkit-transform:scale(1.1, .9);transform:scale(1.1, .9)}75%{-webkit-transform:scale(.95, 1.05);transform:scale(.95, 1.05)}  }

ثم قم بحفظ القالب و هكذا نكون انتهينا و قد تم إضافة التأثير الى اللوجو الخاص بك . 

فيسبوك توتير جوجل + لينكدان بينتريست

احمد غازي مدون عربي عمري 21 سنه من العراق ،هدفي اثراء المحتوى العربي ونشر جديد المقالات التقنية،ادرس طالب جامعي وانشأت المدونة لمشاركة افكاري معكم بجميع المجلات التي تهم الشاب العربي

الكاتب : admin

مواضيع مهمة أيضا