Yazıcağımız çok kısa bir kodla fotoğraflarımızı istediğimiz pencerede açabileceğiz. Gerekli yerlerde değişiklikleri yaparak kendi pencerelerimizi kendimiz dizayn edebilirz. LightBox uygulamasının kullanımı aşağıda kısaca göstereceğim.
Kullanacağımız kütüphaneleri ve fotoğraflarımızı sayfamıza entegre ettikten sonra aşağıdaki kodu <body> taglarının arasına yazmamız yeterli olacaktır.
<div id=”#lightbox”>
<a href=”resim/resim1.jpg” rel=”lightbox”>Manzara 1</a>
<a href=”resim/resim2.jpg”rel=”lightbox”>Manzara 2</a>
<a href=”resim/resim3.jpg” rel=”lightbox”>Manzara 3</a>
</div>
Kullanacağımız kütüphane ve CSS için;
