11550 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
J'ai réalisé 2 galeries gérées par chacune un fichier .js qui ont le même effet à savoir une serie de photo mini qui au click s'affiche en grande photo dans un cadre.
Je n'arrive pas a faire fonctionner les 2. Il y en a toujours une (galerie) qui affiche la grande photo dans une nouvelle page et non dans le cadre définie.
Comprend pas ???
Merci pour votre aide.......
Hello Phildazur et bienvenue. Smiley smile

Tous les médiums du forum étant actuellement en vacances à Tripoli, il va falloir nous donner un peu plus de détails ! Smiley lol

L'idéal serait une page en ligne. A défaut l'intégralité du code (x)html et JavaScript.
Modifié par Heyoan (01 Mar 2011 - 09:01)
Oui effectivement j'aurais du y penser !!
// JavaScript Document
function galerie() {
var photos=document.getElementById ("galerie");
var lien=photos.getElementsByTagName ("a");
var grandephoto=document.getElementById ("grande_image");
for (var i=0;i<lien.length;i++) {
lien.onclick=function() {
grandephoto.src = this.href;
return false;
}
}
} window.onload=galerie;
Voilà ce code fonctionne très bien sur la première galerie mais pas sur la seconde. J'ai cru comprendre que le navigateur ne lisait qu'une fois l' id et qu'on pouvait contourner ce problème en utilisant le Name mais je ne suis pas doué !!!!
Hello Phildazur,

j'ai le même problème que toi!
et j'aurai aimé savoir si tu avais trouvé une solution pour avoir 2 galeries dans une même page html avec le même script...
Salut,

Euh par hasard, quand tu dis deux galeries, elles n'auraient pas le même id ? (ce n'est pas conforme, un id ne peut être répété dans la page). Du coup, le script ne fonctionnera que pour le premier id déclaré.
Modifié par ZeB_panam (09 Apr 2011 - 11:19)
Bonjour,

Ce problème peut se résoudre en se familiarisant un peu plus avec JavaScript. Smiley cligne

Notamment il faudra apprendre:
- Comment boucler sur plusieurs éléments (avec une petite boucle for qui va bien).
- Un peu de traversing DOM. Pour sélectionner des éléments ayant une même classe (plutôt qu'un même identifiant), il y a des fonctions utilitaires parfois un peu complexes (il n'est pas interdit d'essayer de lire et comprendre le code, quitte à potasser sa référence JavaScript). Si on n'assure pas le support d'IE7, on peut aussi utiliser document.querySelectorAll('.ma-classe'), qui est natif dans tous les navigateurs modernes. Pour retrouver un élément parent ou adjacent à partir d'un autre élément, voir du côté de element.parentNode, element.nextSibling, etc.
- Les gestionnaires d'évènement.
- Enfin, utiliser une bibliothèque JavaScript telle que jQuery (un peu lourd, fait plein de trucs) ou base2 (permet d'utiliser des fonctionnalités DOM pratiques dans tous les navigateurs, pas juste dans Firefox 4, Chrome 10 et IE 9).

Par ailleurs, le livre de ton choix pour l'apprentissage de JavaScript est ton ami. Smiley smile