ugrás a tartalomhoz

Js egyszerűbben

cszlak · 2013. Szep. 3. (K), 10.22
Ezt lehet egyszerűbben? Kicsit sok kellene belőle.
Több különálló galéria fut egymás mellett, és úgy kellene, hogy egymás képeit ne mutassa.

 $(document).ready(function() {

$('a.lightbox1'  ).lightBox({
	overlayBgColor: '#000',
	overlayOpacity: 0.6,
	imageLoading: 'images/loading.gif',
	imageBtnClose: 'images/close.gif',
	imageBtnPrev: 'images/prev.gif',
	imageBtnNext: 'images/next.gif',
	txtImage: 'Foto',
	txtOf: 'az',
	containerResizeSpeed: 350});
 
 $('a.lightbox2'  ).lightBox(
{
	overlayBgColor: '#000',
	overlayOpacity: 0.6,
	imageLoading: 'images/loading.gif',
	imageBtnClose: 'images/close.gif',
	imageBtnPrev: 'images/prev.gif',
	imageBtnNext: 'images/next.gif',
	txtImage: 'Foto',
	txtOf: 'az',
	containerResizeSpeed: 350 
	}
	);

 });
 });
‹ Keresési segítség(autocomplette) vagy gyors keresés Html tanfolyam - ellenőrzés segítség ›
 ■
1

Alapok

Hidvégi Gábor · 2013. Szep. 3. (K), 10.55
Javaslom, hogy keress egy "Javascript alapok" című leírást, és abban is a változók és tömbök kezelését nézd át. Emellett a jQuery dokumentációjában érdemes megnézni, hogyan lehet a hasonló elemeket egy lekéréssel megtalálni, és a kapott listán végigiterálni; ehhez a HTML alapjait is ismerni kell, hogy hogyan lehet a hasonló elemeket megjelölni.
4

Köszi

cszlak · 2013. Szep. 3. (K), 11.09
Köszi, szeretem az ilyen jó tanácsokat. De azért ne becsülj le mindjárt valakit, mert egy "egyszerűnek tünő" dologban elakad.
5

Nem becsüllek le, de az első

Hidvégi Gábor · 2013. Szep. 3. (K), 11.25
Nem becsüllek le, de az első pillantásra nyilvánvaló volt, hogy az esetedben hiányzik a gyakorlat. Ahhoz meg az alapokkal kell tisztában lenni, nem? Mindenki volt kezdő, miért kéne ezt szégyellni?
8

De hát ha végül megoldottad

bamegakapa · 2013. Szep. 3. (K), 11.40
De hát ha végül megoldottad magad (teszem azt, Gábor tanácsaitól ösztönözve), akkor mégse beszélt hülyeséget.
2

paraméterek változóba

szabo.b.gabor · 2013. Szep. 3. (K), 10.55
$(function() {  
  var lbParams={  
    overlayBgColor: '#000',  
    overlayOpacity: 0.6,  
    imageLoading: 'images/loading.gif',  
    imageBtnClose: 'images/close.gif',  
    imageBtnPrev: 'images/prev.gif',  
    imageBtnNext: 'images/next.gif',  
    txtImage: 'Foto',  
    txtOf: 'az',  
    containerResizeSpeed: 350
  };
  
  $('a.lightbox1').lightBox(lbParams);  
   
  $('a.lightbox2').lightBox(lbParams);  
});
hirtelen ennyi, aztán hogy az adott lightbox plugin ad-e valami lehetőséget a képek csoportosítására, az már más kérdés
3

Közben megoldottam

cszlak · 2013. Szep. 3. (K), 11.08
Köszönöm közben megoldottam. Egyszerűbben.
Ime:

$(function(){
         $('.lightboxGallery').each(function(){
            $('.lightbox', this).lightBox({
	overlayBgColor: '#000',
	overlayOpacity: 0.6,
	imageLoading: 'images/loading.gif',
	imageBtnClose: 'images/close.gif',
	imageBtnPrev: 'images/prev.gif',
	imageBtnNext: 'images/next.gif',
	txtImage: 'Foto',
	txtOf: 'az',
	containerResizeSpeed: 350});
        });
		
	
		
    });


<div id="gallery4" class="lightboxGallery" style="margin-left:110px;">
<a href="Galeria/3-big.jpg" class="lightbox" title="">
<img src="Galeria/sur1.png" width="209" height="100" class="galeri" /></a>
<a href="Galeria/-big.jpg" class="lightbox" title="">
<img src="Galeria/sur2.png" width="164" height="100" class="galeri"/></a>
.....
6

Olvass utána a jQuery

tgr · 2013. Szep. 3. (K), 11.35
Olvass utána a jQuery selector szintaxisának.
$('a.lightbox1, a.lightbox2').lightBox(...)
vagy
$('.lightboxGallery .lightbox').lightBox(...)
7

Kérdés, hogy az a plugin

bamegakapa · 2013. Szep. 3. (K), 11.38
Kérdés, hogy az a plugin mennyire okos, és külön galériának kezeli-e őket így.
10

A rel paraméterrel lehet

Hidvégi Gábor · 2013. Szep. 3. (K), 11.44
A rel paraméterrel lehet megmondani, hogy melyik link melyik galériát nyissa meg.
11

OK, a pluginnak nem néztem

bamegakapa · 2013. Szep. 3. (K), 12.07
OK, a pluginnak nem néztem utána, "lightBox" névvel gyakorlatilag ezerféle lehet :). Ha elolvassa a dokumentációt, valószínűleg van még egyszerűbb mód.
12

Ha nem, akkor dobja el és

tgr · 2013. Szep. 3. (K), 12.13
Ha nem, akkor dobja el és keressen másikat, folyót lehet rekeszteni színvonalas lightbox pluginokkal. Az egyik alapvető jQuery plugin konvenció, hogy ha egy listára hívod meg, azt úgy kezelje, mintha a lista elemeire egyenként hívnád meg, ami ezt nem tartja be, az nagyobb szörnyűségekre is képes lehet.
9

Szerintem a beállításokat

bamegakapa · 2013. Szep. 3. (K), 11.41
Szerintem a beállításokat mentsd egy változóba még a ciklus előtt, hatékonyabb és talán kicsit olvashatóbb is lesz a kód.

    var lightboxSettings = {  
        overlayBgColor: '#000',  
        overlayOpacity: 0.6,  
        imageLoading: 'images/loading.gif',  
        imageBtnClose: 'images/close.gif',  
        imageBtnPrev: 'images/prev.gif',  
        imageBtnNext: 'images/next.gif',  
        txtImage: 'Foto',  
        txtOf: 'az',  
        containerResizeSpeed: 350  
    };

    $('.lightboxGallery').each(function(){  
        $(this).find('.lightbox').lightBox(lightboxSettings);
        //a find ugyanaz mint a context amit használtál, szerintem olvashatóbb így
    });