Websiteleri için Lightbox eklentisi

NASIL KULLANILIR

1. Adım - Javascript ve CSS'yi yükleme

1. Lightbox'un en son sürümünü indirin ve açın.
İNDİR
2. Jquery-1.11.0.js ve lightbox.js bulmak ve bu dosyaların ikisinide yüklemek için js klasörünün içine bakın. İlk jQuery yükleyin.

   <script src="js/jquery-1.11.0.js"></script>
   <script src="js/lightbox.js"></script>

3. Lightbox.css bulmak ve yüklemek için css klasörünün içine bakın.

   <link href="css/lightbox.css" rel="stylesheet" />

4. Close.png, loading.gif, prev.png ve next.png bulmak için img klasörünün içine bakın. Bu dosyaları lightbox.css kullanılır. Varsayılan olarak, lightbox.css img adında bir klasör bu görüntüler için arayacaktır.

2. Adım - Çalıştırın

• Lightbox'u etkinleştirmek için herhangi bir görüntü bağlantısı için bir data-lightbox özniteliğini ekleyin.Niteliğin değeri, her bir görüntü için benzersiz bir ad kullanın. Örneğin:

  <a href="img/image-1.jpg" data-lightbox="image-1" data-title="Resmin başlığı">Image #1</a>

  İsteğe bağlı: Bir başlığı göstermek istiyorsanız data-title özniteliğini ekleyin.
• Eğer, bir dizi birleştirmek görüntülerin tümü için aynı data-lightbox öznitelik değeri kullanmak istiyorsanız, ilgili görüntüler için bir grup varsa. Örneğin:

  <a href="img/image-2.jpg" data-lightbox="macera">Image #2</a>
  <a href="img/image-3.jpg" data-lightbox="macera">Image #3</a>
  <a href="img/image-4.jpg" data-lightbox="macera">Image #4</a>