Après pas mal de zigonnages, mon chum a réussi à modifier le code pour arrive au résultat que je cherchais (ouais... il ne m'avait pas dit qu'il pouvait faire ça! XD)
Le lien a été mis à jour:
http://www.ggtelecom.ca/2010/FR/PhotosVideosIRB-2009_FR02.html
pour ceux que ça intéresse:
// JavaScript Document
function getURLVar(urlVarName)
{
//divide the URL in half at the '?'
var urlHalves = String(document.location).split('?');
var urlVarValue = '';
if(urlHalves[1])
{
//load all the name/value pairs into an array
var urlVars = urlHalves[1].split('&');
//loop over the list, and find the specified url variable
for(i=0; i<=(urlVars.length); i++)
{
if(urlVars[i])
{
//load the name/value pair into an array
var urlVarPair = urlVars[i].split('=');
if (urlVarPair[0] && urlVarPair[0] == urlVarName)
{
//I found a variable that matches, load it's value into the return variable
urlVarValue = urlVarPair[1];
}
}
}
}
return urlVarValue;
}
function displayPics()
{
var photos = document.getElementById('thumbs') ;
// On récupère l'élément ayant pour id galerie_mini
var liens = photos.getElementsByTagName('a') ;
// On récupère dans une variable tous les liens contenu dans galerie_mini
var thumbnails = photos.getElementsByTagName('img');
var big_photo = document.getElementById('big_pict') ;
// Ici c'est l'élément ayant pour id big_pict qui est récupéré, c'est notre photo en taille normale
var titre_photo = document.getElementById('photo').getElementsByTagName('li')[0] ;
// Et enfin le titre de la photo de taille normale
var page = getURLVar('page');
if(page == '')
page = '1';
var nbPhotosEl = document.getElementById('nbPhoto');
var nbPhotos = parseInt(nbPhotosEl.title)-1;
var nbPhotosDisp = nbPhotos - (liens.length * (page-1));
//Bouton Suivant
var navSuivant = document.getElementById('next');
if(page <= nbPhotos/liens.length)
navSuivant.href = document.URL.substring(0,document.URL.lastIndexOf('.html')+5) + '?page=' + (parseInt(page)+1);
else
navSuivant.style.visibility = "hidden";
//Bouton Precedent
var navPrecedent = document.getElementById('prev');
if(page > 1)
navPrecedent.href = document.URL.substring(0,document.URL.lastIndexOf('.html')+5) + '?page=' + (parseInt(page)-1);
else
navPrecedent.style.visibility = "hidden";
// Une boucle parcourant l'ensemble des liens contenu dans galerie_mini
for (var i = 0 ; i < liens.length ; i++) {
// Au clique sur ces liens
if(i <= nbPhotosDisp)
{
thumbnails[i].src = thumbnails[i].src.substring(0,thumbnails[i].src.lastIndexOf('_')+1) + ( parseInt(liens[i].id) + (parseInt(page)-1)*16 ) + '.jpg';
liens[i].href = liens[i].href.substring(0,liens[i].href.lastIndexOf('_')+1) + ( parseInt(liens[i].id) + (parseInt(page)-1)*16 ) + '.jpg';
//alert(( parseInt(liens[i].id) + (parseInt(page)-1)*16 ) + ' ' + ( parseInt(liens[i].id) + (parseInt(page)-1)*16 ));
liens[i].onclick = function()
{
big_photo.src = this.href; // On change l'attribut src de l'image en le remplaçant par la valeur du lien
big_photo.alt = this.title; // On change son titre
titre_photo.firstChild.nodeValue = this.title; // On change le texte de titre de la photo
return false; // Et pour finir on inhibe l'action réelle du lien
};
}
else
thumbnails[i].style.visibility = "hidden";
}
}
window.onload = displayPics;
// Il ne reste plus qu'à appeler notre fonction au chargement de la page
[/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i][/i]
Je commence à comprendre un peu le fonctionnement... mais j'ai encore un sacré bout d'chemin à faire.
La prochaine étape est la création d'un carousel pour la présentation des produit (ouais ba... j'suis pas sortie l'auberge!)
Modifié par juliesunset (30 Jun 2009 - 22:25)