Jquery: Incrimentation per ogni insieme di elementi in più di 1 div

Question

Sto facendo una presentazione Jquery. Essa elenca le miniature, che se cliccato su, rivelano l'immagine grande come una sovrapposizione. Per abbinare il pollice con le immagini di grandi dimensioni che sto aggiungendo attributi per ogni miniatura e grande immagine. Gli attributi contengono un numero che soddisfa ogni pollice alla sua grande immagine corrispondente. Funziona quando una presentazione è presente su una pagina. Ma voglio farlo funzionare se più di un presentazione è presente.

Ecco il codice per l'aggiunta di attributi per i pollici e le immagini di grandi dimensioni:

thumbNo = 0;
largeNo = 0;
$('.slideshow_content .thumbs img').each(function() {            
   thumbNo++;
   $(this).attr('thumbimage', thumbNo);
   $(this).attr("title", "Enter image gallery");
});
$('.slideshow_content .image_container .holder img').each(function() {   
   largeNo++;
   $(this).addClass('largeImage' + largeNo);
});

Questo funziona. Per far funzionare Incremento quando ci sono due presentazioni in una pagina, ho pensato che avrei potuto attaccare questo codice in un ogni funzione ...

$('.slideshow').each(function() {
    thumbNo = 0;
    largeNo = 0;
    $(this + '.slideshow_content .thumbs img').each(function() {            
       thumbNo++;
       $(this).attr('thumbimage', thumbNo);
       $(this).attr("title", "Enter image gallery");
    });
    $(this + '.slideshow_content .image_container .holder img').each(function() {   
       largeNo++;
       $(this).addClass('largeImage' + largeNo);
    });
});

Il problema di questo è che l'operatore incrimenting non reimposta per il div secondo presentazione (.slideshow), così finisco con i pollici nel primo div .slideshow essere numerati 1,2,3, ecc .. e il pollice in il secondo div .slideshow essere numerati 4,5,6 ecc Come faccio a fare i numeri nella seconda ripristino .slideshow div e ripartire da 1 nuovo?

Questo è veramente difficile da spiegare in modo conciso. Spero che qualcuno comunque l'idea.

Answer 1

Nel vostro ciascuna, si scende di un livello, assicurarsi che sia di ambito per ogni presentazione in questo modo:

$('.slideshow_content').each(function() {
    thumbNo = 0;
    largeNo = 0;
    $(this).find('.thumbs img').each(function() {
       $(this).attr('thumbimage', thumbNo++);
       $(this).attr("title", "Enter image gallery");
    });
    $(this).find('.image_container .holder img').each(function() {   
       $(this).addClass('largeImage' + largeNo++);
    });
});

Questo li imposta a 0 all'interno di ciascun blocco .slideshow_content e loop interno invece di impostazione complessiva e quindi scorrendo tutti i blocchi.