كيفيه وشرح اضافه الصور المنبثقه Jquery Lightbox في 12:26 م

كيفيه وشرح اضافه الصور المنبثقه Jquery Lightbox 

 

بسم الله الرحمن الرحيم 

 هذه الخاصيه رائعه جدت وتستطيعون مشاهدتها من خلال الضغط علي الصور التي في مدونتنا

لقد حاول الكثير فعلها علي مدونتهم ولكن فشلو وانا اتيكم اليوم بكيفيه اضافه هذه الخاصيه

قل وداعا لعمل كل صوره بمفردها الان ضع الصوره وستتحول تلقائي 

الخطوات

1.  اذهب الي لوحه تحكم مدونتك 
2. ادخل علي تصميم
3. ادخل علي تحرير html اعلي الصفحه
4. اعمل علامه صح علي توسيع عناصر الصفحه 
5. ابحث عن طريق ctrl+f
6. ابحث عن

</body>

 ثم ضع هذا الكود فوقه مباشرة

<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='http://lightboxabuiyad.googlecode.com/svn/jquery.lightbox-0.4.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() {
$(&#39;a[href$=jpg], a[href$=JPG], a[href$=jpeg], a[href$=JPEG], a[href$=png], a[href$=gif], a[href$=bmp]:has(img)&#39;).lightBox();
});
</script>إقرأ المزيد على مدونة شباب مصر http://egy-shbab.blogspot.com/

بعد كدا الف مبروك congratulation

donot forget to say thanks

لاتنسي تعليقك

تنبيه : المرجوا عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

abuiyad