Lightbox JS V2

Lightbox JS ile resimleriniz arasında daha etkili bir görünümle dolaşma imkanı bulacaksınız. Kullanımı ve uygulaması çok kolay. 1-2 dakika içinde web sitenizde lightboxlabir resim galerisi oluşturabilirsiniz. Ayrıntılar...

Nasıl Kullanılır?

Bölüm 1 - Yükleme

1. <script type="text/javascript" src="js/prototype.js"></script>
   <script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
   <script type="text/javascript" src="js/lightbox.js"></script>
   

   
   
2. Lightbox 'ın CSS dosyasını içini aktarın.
   

   <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
   

   
   
3. CSS dosyasını kontrol edin ve prevlabel.gif ve nextlabel.gif dosyalarının referans yerlerinin doğru yerde olduğuna emin olun. Ayrıca bu iki dosyanın lightbox.js dosyasının üstündeki dizinde doğru yerde olduğuna dikkat edin.

Bölüm 2 - Aktif Etme

1. İlk olarak lightbox 'ı aktif etmek için link verdiğiniz kısma (<a href="..">)rel="lightbox" ekleyin. Örneğin:
   

   <a href="images/resim.jpg (resim dosyanız)" rel="lightbox" title="Başlık">Resim 1</a>
   

   
   Dilerseniz; Resminiz ile ilgili kısa bir başlık yazmak isterseniz title kullanabilirsiniz. Yazdığınız bu yazı açılan resmin tam altında görünecektir.


2. Gruplamak istediğiniz ve birbirleriyle ilişkili olan resmileriniz varsa, ilk adımı uygulayın. ama bundan farklı olarak rel kısmı içine Köşeli parantezler ([ ... ]) içine bir grup adı (yolculuk - RoadTrip) yazın. Örneğin;
   

   <a href="images/image-1.jpg" rel="lightbox[yolculuk]">Resim #1</a>
   <a href="images/image-2.jpg" rel="lightbox[yolculuk]">Resim #2</a>
   <a href="images/image-3.jpg" rel="lightbox[yolculuk]">Resim #3</a>
   

   
   Resim sayısında bir sınırlama yok . Dilediğiniz kadar ekleyebilirsiniz.
   İyi eğlenceler....
   
   
   Kaynak= Lightbox JS Web Sitesi
   
   Çeviri = NufzaM - NF Scriptable

Örnekleri İndir...