Tamás mai cikkének köszönhetően egy egyszerű, lapozható képgalériát készíthetünk a weboldalra.
Az alábbi módon mi magunk is be tudunk állítani egy úgynevezett ligthbox galériát.
Ezeknek a típusoknak az a jellemzőjük, hogy az oldalon, ha egy képre kattintunk, elsötétíti a hátteret és szinte kivilágítva jelenik meg. Amennyiben több kép is szerepel az adott galériában, akkor lapozható módon végignézhetjük őket.
1. Le kell töltenünk egy javascript csomagot, pl. a következő helyről: http://lokeshdhakar.com/projects/lightbox2/ A zip fájlt a megfelelő könyvtárunka kicsomagoljuk.
2. Azon a lapon, ahol használni szeretnénk a galériát, be kell szúrnunk a megfelelő javascript file-okat a html oldalunk <head> részébe a következő sorokkal: <script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
3. Ahhoz, hogy a kinézet is megfelelően működjön, a letöltött csomagban kész CSS file is szerepel.
Ezt is illesszük be: <link href="css/lightbox.css" rel="stylesheet" />
4. A következő lépések már az adott képekre vonatkoznak, amiket meg szeretnénk jeleníteni.
Adjuk hozzá a data-lightbox paramétert ahhoz a linkhez, aminél működtetni akarjuk a galériát. Azonos értékkel ugyanabban a galériában jelennek meg a képek, egyedi értéknél pedig önállóan.
<a href="nagykep.jpg" data-lightbox="galeria" title="Nagy kép"><img src="kiskep.jpg" alt="Kis kép" ></img></a>
Jó gyakorlást kívánunk!
Érdekli a webdesign, és a webprogramozás?
November második felében, a pécsi képzési központunkban induló Akkreditált Webdesigner Mester,
Webprogramozó Mester, és Web Artist (Webdesigner-Webprogramozó) tanfolyamainkra legkésőbb november 16-ig még jelentkezhet!
Használja ki, hogy novemberben még a 2013-as, kedvezményes tandíjon tanulhat!
Jelentkezzen itt, vagy bármelyik másik elérhetőségünkön!
Dolgozzon szakirányú képzéseink elvégzése után képzett Webdesignerként, Webprogramozóként!
Kiscsoportos, gyakorlat orientált tanfolyamok angol-magyar bizonyítvánnyal, részletfizetési lehetőséggel, munkalehetőséggel a képzések végén!
Várjuk induló képzéseinkre!
További, induló informatika képzéseinkért kattintson ide!
NetlogiC School Informatika Szakképző Iskola Pécs
Gyakorlat orientált informatika oktatás rugalmas időbeosztással!
www.netlogi-c.net
