jquery gallery

[misshellfire]

Buongiorno!
sto usando questa gallery
http://tympanus.net/codrops/2011/09/...image-gallery/

perchè se la metto due volte nello stesso progetto la seconda volta non si vedono le immagini???

grazie

[lucavizzi]

ciao misshellfire
come le inizializzi le due gallery?

[misshellfire]

ciao Luca,
metto questo

<script id="img-wrapper-tmpl" type="text/x-jquery-tmpl">	
			<div class="rg-image-wrapper">
				{{if itemsCount > 1}}
					<div class="rg-image-nav">
						Previous Image
						Next Image
					</div>
				{{/if}}
				<div class="rg-image"></div>
				<div class="rg-loading"></div>
				<div class="rg-caption-wrapper">
					<div class="rg-caption" style="display:none;">
						

</p>
					</div>
				</div>
			</div>
		</script>

grazie!

[lucavizzi]

Potresti provare a modificare nel file "gallery.js" alla riga 51:

da:
var $rgGallery = $('#rg-gallery'),

a:
var $rgGallery = $('#rg-gallery,#rg-gallery2'),

poi, nell'HTML dovresti modificare il secondo id="rg-gallery" con id="rg-gallery2"

[misshellfire]

Sembrerebbe funzionare tutto... grazie mille Luca.

Secondo te si potrebbe implementare questa gallery con delle categorie?
Non so tipo... cliccando sulla categoria 2 le thumb della 1 vengono sostituite da quelle della 2...


Buona serata!

[lucavizzi]

Originariamente inviato da misshellfire
Sembrerebbe funzionare tutto... grazie mille Luca.

Secondo te si potrebbe implementare questa gallery con delle categorie?
Non so tipo... cliccando sulla categoria 2 le thumb della 1 vengono sostituite da quelle della 2...


Buona serata!

Figurati miss

Non ho capito esattamente cosa vuoi ottenere, si potrebbe, ad esempio, settare un display:none sulla gallery2 ed al click sulla thumb della categoria2 impostare il display:block alla gallery2 ed il display:none alla gallery1. Oltre le due gallery però la pagina diventerebbe forse un po' troppo pesante.

[misshellfire]

Esatto il senso sarebbe quello....... dici diventerebbero troppo pesanti?
sarebbe meglio una gallery già predisposta con delle categorie?

[lucavizzi]

Anche una gallery predisposta sarebbe pesantuccia... conviene usare thumbs molto leggere.

Mettiamo che predisponi tre, ma possono essere due o quattro, gallery
(var $rgGallery = $('#rg-gallery,#rg-gallery2,#rg-gallery3'),

<div id="rg-gallery" class="rg-gallery">
...
</div>

<div id="rg-gallery2" class="rg-gallery">
...
</div>

<div id="rg-gallery3" class="rg-gallery">
...
</div>

e le relative tre thumbs:

[img]thumbs/thumb1.jpg[/img]
[img]thumbs/thumb2.jpg[/img]
[img]thumbs/thumb3.jpg[/img]

nel file gallery.js puoi aggiungere:

$(function(){
    $('#rg-gallery,#rg-gallery2').css('display','none');//nascondo le gallery 1 e 2, eventualmente modifica gli id
    $('.id-class').css('cursor','pointer');//cursore manina thumbs categorie
    $('.id-class').click(function(){//funzione onclick delle thumbs categorie
        var show=$(this).attr('alt');//id da mostrare
        $('.rg-gallery').css('display','none');//nascondo precedente
        $('#'+show).fadeIn();//mostro attuale (invece di fadeIn puoi anche usare slideDown)
    });
});

[misshellfire]

Buongiorno!
allora.... nel gallery.js ho messo questo

(var $rgGallery = $('#rg-gallery,#rg-gallery2,#rg-gallery3')

nell'html ho duplicato la gallery 3 volte ed assegnato l'id corrispondente...
sotto le gallery ho inserito questo:

[img]thumbs/thumb1.jpg[/img]
[img]thumbs/thumb2.jpg[/img]
[img]thumbs/thumb3.jpg[/img]

e sempre nel gallery.js l'ultimo codice che mi hai postato... l'ho messo sotto tutto... non so se è corretta la posizione.....

funziona la logica solo che cliccando per cambiare gallery le thumb si pongono in verticale e la gallery non parte....

[lucavizzi]

Dovrei vedere il codice, puoi postare un link alla pagina qui o in pvt?