السلام عليكم, هذا الشرح عن طريقة إضافة جديدة من إضافات بلوجر وهي تأثير تحريك اللوجو علي مدونات بلوجر بطريقة جميلة جدا واحترافية تعطي شكل احترافيا عند المرور بالماوس علي اللوجو الخاص بشكل أنيق جدا ومميز وكل هذا دون التأثير علي سرعة القالب الخاص بك في بلوجر.
طريقة إضافة تأثير التحريك علي اللوجو في مدونات بلوجر
- قم بالذهاب إلي بلوجر
- ثم الانتقال الي الجزء الخاص بالمظهر
- ثم انتقل الي تحرير HTML
- ثم ابحث عن الوسم ]]>*/</style> وقم بوضع الكود التالي فوقه مباشرة
هل إضافة كود تأثير التحريك علي اللوجو يأثر علي سرعة مدونة بلوجر ؟
لا ياصديقي كود الcss الموجود في هذا الشرح لو يؤثر أبدا علي سرعة الموقع الخاص بك هو فقط يقوم بعمل شكل جمالي عند تحريك الماوس علي اللوجو او حتي من الهاتف, كان هذا كل شيئ وانا اعرف ان هذا الشرح بسيط جدا لكن من الممكن ان هناك من يبحث عن تلك الإضافة, اذا واجهتك أي مشكلة في تركيب الكود لاتتردد في كتابة تعليق, دمتم في أمان الله.
/* Logo animation */
#Header1 h1 a:hover{/*animation*/
-webkit-animation:jelly .5s;-moz-animation:jelly .5s;-ms-animation:jelly .5s;-o-animation:jelly .5s;animation:jelly .5s;}
#Header1 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);}}
