08-01-2012, 02:54 PM
|
#1
|
مدير عام
تاريخ التسجيل: Apr 2012
الدولة: جده
المشاركات: 2,846
|
شرح إضافة انبثاق الصور الأتوماتيكي LightBox إلى بلوجر
السلام عليكم ورحمة الله وبركاته
في هذا الشرح سنتعرف على طريقة إضافة انبثاق الصور الأوتوماتي (LightBox) إلى مدونات بلوجر
مثال على الإضافة :
شرح التركيب :
1- قم بتطبيق : شرح إلغاء انبثاق الصور الأتوماتيكي من بلوجر
2- إذهب إلى تحرير HTML وعلم على توسيع قوالب عناصر واجهة المستخدم، ابحث عن </body> وأضف قبلها الكود التالي :
كود PHP:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/> <style type='text/css'> /* jQuery lightBox plugin - Gallery style */ #gallery { background-color: #444; padding: 10px; width: 520px; } #gallery ul { list-style: none; } #gallery ul li { display: inline; } #gallery ul img { border: 5px solid #3e3e3e; border-width: 5px 5px 20px; } #gallery ul a:hover img { border: 5px solid #fff; border-width: 5px 5px 20px; color: #fff; } #gallery ul a:hover { color: #fff; } </style> <script src='https://bloggerexp.googlecode.com/svn/trunk/jquery.lightbox-04.js' type='text/javascript'/> <link href='http://dinhquanghuy.110mb.com/lightbox/jquery.lightbox-0.5.css' media='screen' rel='stylesheet' type='text/css'/> <script type='text/javascript'> $(function() { $('a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)').lightBox(); }); </script>
غير مسجل إذا أعجبتك الإضافة لا تبخل علينا بالنقر على زر أعجبني للفيسبوك أسفله.
__________________
|
|
|