Javascript image gallery

Question

Je suis à la recherche d'une fonction javascript qui fonctionne autour d'un tableau d'images générées dynamiquement. En ce moment j'ai une fenêtre de prévisualisation. Quand on clique dessus, je voudrais qu'il cache la fenêtre de prévisualisation et charge la première image dans le tableau. Je voudrais être capable de naviguer à travers les images restantes dans le tableau.

Si quelqu'un pouvait me diriger dans la bonne direction ou si vous savez comment mettre cela ensemble, ce serait très apprécié. Merci.

Answer 1

Vous pouvez créer dynamiquement un élément d'image et continuer à l'utiliser, quelque chose comme ça? (ceci utilise jQuery).

<button id='nextImage'>Load nect image</button> 
<div id='imageContainer'><div id='previewWindow'>Preview</div></div> 


//Javascript frome here (JQuery) 
var images = Array(); 
images.push('url/to/image.jpg'); 
window.lastImage=-1; 
$('#previewWindow').click(function() { ('#nextImage').click(); }); 
$('#nextImage').click(function() { 
window.lastImage += 1; 
if(typeof(images[window.lastImage]) == 'undefined') { return; } //if endof array 
$('#previewWindow').remove(); //better is to only do this once 
$('#image').remove(); //Only creating an image once is even better 
$('<img />') 
    .attr('id', 'image') 
    .attr('src', images[window.lastImage]) 
    .appendTo('#imageContainer'); 
}); 

EDIT
Il suffit de lire que vous souhaitez pouvoir cliquer sur la fenêtre de prévisualisation, a ajouté que.