إضافة لتضخيم الصور تلقائيا بمجرد المرور عليها

عدد مشاهدات الموضوع:

إضافة جديدة لمدونات بلوجر تعمل تضخيم تلقائي لصور التدوينات عند مرور مؤشر الفأرة عليها. هذه الإضافة مفيدة جدا لأصحاب مدونات الصور والمعارض وغيرها من المجالات التجارية التى تعبر الصور عن عملهم.

يمكنك معاينة الإضافة من هنا (مدونة تجريبية). والأن بعد مشاهدة الإضافة اذا اعجبتك يمكنك المتابعة لإضافتها.


1- الدخول على لوحة التحكم ثم القالب Template ثم اختر تخصيص Customise
2- اختار متقدم Advanced ثم Add CSS وضع هذا الكود فى المستطيل


/* CSS image zoom effect http://www.abu-iyad.com */
.post img {
height: 100%;
width: 100%;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.post img:hover {
width:
150%;
height:
150%;
}
/*CSS image zoom effect http://www.abu-iyad.com */
3- إضغط على  Apply to Blog



يمكنك تغيير 150% إلى 200% اذا أردت تضخيم الصورة أكثر عند مرور مؤشر الفأرة على الصورة. 

لاحظ : لتفعيل كلمة Apply to Blog قم بالنقر أخر الكود وخذ مسافة ومن ثم اضغط على Apply to Blog لاتمام المهمة. اذا اعجبك الكود قم بمشاركته على مواقعك المفضلة :)

تنبية : بعض المدونات تستخدم القوالب الاعتيادية من بلوجر وستواجههم مشكلة عند إضافة الأداة الا وهى أن صورة تعديل التدوينة تتضخم تلقائيا ولعلاج المشكلة يمكنك التعديل على القالب والبحث عن كلمة "edit_allbkg.gif" وحذف رابط الصورة بالكامل.


مصدر الكود: spiceupyourblog
مصدر الصورة أعلى التدوينة: supertrucosweb.com

هناك 6 تعليقات:

  1. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  2. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  3. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  4. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  5. ابو اياد سلمتيداك يا اخلى الغالى ولى طلب ارغى تصميم لى مدونتى شو اسوى اخىارجو الرد منك

    ردحذف
  6. اانا عايز شرح بالصور لاني مش عارف فين اعمل كده سعدوووووووووووووني

    ردحذف

مدونة أبو إياد تصميم بلوجرام جميع الحقوق محفوظة 2016

اعلان مخفى فى الرئيسية