Discussion :

[revline]

Bonjour,

Je ne suis pas du tout calée en javascript et j'ai besoin de votre aide.
J'utilise deux scripts dans ma page , l'un pour afficher un menu, au démarrage, l'autre pour agrandir la photo (il s'agit du script gratuit "enlarge-it")

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<script type="text/javascript" src="../enlargeit_me.js"></script>
<script type="text/javascript">
onload = function(){ drawTable(); };
</script>

Enlarge it fait appel à des images de curseurs
Si je place la ligne concernant "enlargeit" avant l'appel de menu (ce que j'ai fait), ce curseur n'apparait pas au passage de la souris sur l'image, il faut d'abord cliquer dessus, ce n'est pas pratique.
Si je la place en dernier... c'est le menu qui n'est plus affiché.
Comment faire ?

Voici la ligne concernant l'image :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 <!-- image -->
      <img src="03-01_Scille-du-Perou_linepassions.jpg" alt="Bourgeon de Scille du P&eacute;rou" name="Image" width="800" height="600" border="0" title="Bourgeon de Scille du P&eacute;rou"
      longdesc="03-01_Scille-du-Perou_linepassions.jpg" onClick="enlarge(this);"></td>
  <!--fin cellule image -->

Quant au script externe, voici le lien.

Merci de votre aide.

[Watilin]

Salut,

d’après ce que je vois, Enlarge-it possède un mécanisme de détection des fonctions onload. Ça devrait marcher si tu le mets après ton script… C’est bizarre.

Quoiqu’il en soit, en utilisant un gestionnaire d’évènement, tu n’auras plus de soucis. Attention la syntaxe est un peu plus lourde :

Code JS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
if (addEventListener in window) { // navigateurs standard
   window.addEventListener('load', drawTable, false);
} else { // pour MSIE 7 et antérieurs
   window.attachEvent('onload', drawTable);
}

Pour l’anectode, le mécanisme de détection utilisé par Enlarge-it a été proposé pour la première fois par Simon Willson :
http://simonwillison.net/2004/may/26/addloadevent/

[SpaceFrog]

je viens de découvrir que des "scripts" pouvaient se cacher mutuellement ...

[revline]

Merci, Watilin, très gentil.
Bon, je ne sais pas ce qu'est un gestionnaire d'événements, quoi que je vois à peu près...
En tous cas, si je remplace le script de menu par ton script : le menu n'apparaît pas !
Je n'y comprends vraiment rien !!!

Merci quand même.
Si quelqu'un a une autre idée ?

Marie-Line


(en fait, sur IE, le menu s'affiche mais enlarge-it ne fonctionne pas du tout,
sur firefox, enlarge-it fonctionne une fois que l'image a le focus)

[Watilin]

(en fait, sur IE, le menu s'affiche mais enlarge-it ne fonctionne pas du tout,
sur firefox, enlarge-it fonctionne une fois que l'image a le focus)

Tu as mis Enlarge-it sur un attribut onclick, donc l'image a forcément le focus non ?
C'est quoi ta version d'IE ?

D'autre part, peux-tu me montrer le code de la fonction drawTable ?

[revline]

C'est le menu qui a le focus, et non l'image.

Voici le script drawTable :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!--
function drawTable(){
var pages = [
["Bouton de Scille du P&eacute;rou", "03-01.html"], // format : ["titre", "adresse page"],
["Fumeterre Blanche", "03-02.html"],
["Cognassier du Japon", "03-03.html"],
["Pinson sur le m&eacute;lia", "03-04.html"],
["Gypsophile en bouquet", "03-05.html"],
["Ortie &agrave; fleur violette", "03-06.html"],
["Floraison du laurier-tin", "03-07.html"],
["Coronille", "03-08.html"],
["Calc&eacute;olaire", "03-09.html"],
["B&eacute;gonia Rex Hybride", "03-10.html"],
["Pens&eacute;es rouges", "03-11.html"],
["Delosperma", "03-12.html"],
["G&eacute;ranium molle", "03-13.html"],
["Tulipe et narcisses", "03-14.html"],
["Crocus mauves et blancs", "03-15.html"],
["Marguerite &eacute;crue", "03-16.html"],
["Primev&egrave;res rouges", "03-17.html"],
["Hypoestes", "03-18.html"],
["Jonquille", "03-19.html"],
["Forsythia sous la neige", "03-20.html"],
["Primevères sauvages", "03-21.html"],
["Ficoïde orange", "03-22.html"],
["Muscari", "03-23.html"],
["Tulipes multiflores", "03-24.html"],
["A&iuml;l de Naples", "03-25.html"],
["Tulipes 'cr&egrave;me'", "03-26.html"],
["Oeillet d'Inde", "03-27.html"],
["Thym", "03-28.html"],
["Freesias", "03-29.html"],
["Bourrache", "03-30.html"],
["Forsythia", "03-31.html"]];
 
var table = '<table border="0" cellpadding="0" cellspacing="0" width="154"><tbody>'
for(var i=0; i<pages.length; i++){
table += '<tr><td class="MiniSt"><a href="'+pages[i][1]+'">'+(i+1)+'. '+pages[i][0]+'</a></td></tr>';
}
table += '</tbody></table>';
document.getElementById("pagesList").innerHTML = table;
}
//-->

J'essaie de réécrire mes pages en XHTML 1.0 Transitional (comme sur le site d'enlarge-it), mais je ne sais pas si ça peut changer quelque chose
(ah oui, sur IE9, enlarge-it ne fonctionne pas sans ça, et encore, il faut débloquer des tas de choses !!! Je n'aime pas IE !!! )

Je sais que vous allez trouver une solution !
Merci

[Watilin]

Bonsoir !

Comme ça, il n'y a aucune raison que ça ne marche pas. À moins que l'élément "pagesList" n'existe pas. On n'a pas parlé des messages d'erreur… Quand on débute on ne sait pas toujours où les trouver. Avec IE (pour ça au moins il est pratique) tu fais F12 et ça ouvre une console. Recharge la page ; s'il y a des erreurs elles devraient s'afficher.

Sous FF il y a une console d'erreur plutôt bien cachée puisqu'il faut faire Ctrl+Maj+J pour la voir. Et cliquer sur le bouton "erreurs" sinon on ne voit rien avec tous les avertissements CSS. Efface-la un bon coup, recharge la page et pareil, les erreurs devraient apparaître.

Un conseil si tu as l'intention de continuer le JavaScript : installe Firebug !