[Résolu] Attribut title dans javascript

Bonjour,

Le code javascript suivant affiche des images dans un tableau d'une page htm :

content=content+"<img ";
content+="title="+vTitre[ i ]+" src='"+vThumb[ i ]+"' />" ;

Le problème se situe dans l'attribut title de la balise img : celui n'affiche que le premier mot du titre de l'image +vTitre[ i ]+ constitué par des mots séparés par des blancs.

En dehors de la solution qui consiste à remplacer les blancs dans le titre par des caractères insécables   existe t'il une autre solution pour afficher le titre complet.

Comment fait-on sur ce forum pour signaler les sujets ayant reçus une solution ?

Merci par avance pour votre aide.
Modifié par mara (04 Dec 2007 - 16:57)

mara a écrit :
Le problème se situe dans l'attribut title de la balise img : celui n'affiche que le premier mot du titre de l'image +vTitre[ i ]+ constitué par des mots séparés par des blancs.

Tu veux dire que lorsque la valeur de vTitre[ i ] est "une chaine de caractères", tu n'obtiens que "une" car la chaine est tronquée à la première espace?

Ça me semble bizarre.
Peut-être le fait que (sauf erreur de ma part) tu ne génères pas de quotes pour encadrer la valeur du title?
Il faudrait alors corriger ainsi, par exemple:

content += '<img title="' + vTitre[ i ] + '" src="' + vThumb[ i ] + '" />';

Sinon, il me semble aussi (mais je dis peut-être une bêtise, suis néophyte en la matière) que tu pourrais passer par createElement et setAttribute pour générer ce contenu, non?

Et aussi: pas de texte alternatif pour ton image?

mara a écrit :
Comment fait-on sur ce forum pour signaler les sujets ayant reçus une solution ?

On marque «[Résolu]» dans le titre du sujet, en éditant le premier message du sujet. Au final, ça donne quelque chose comme «[Résolu] Titre de mon sujet».

Salut,

Florent V. a écrit :
Peut-être le fait que (sauf erreur de ma part) tu ne génères pas de quotes pour encadrer la valeur du title?

+1

Florent V. a écrit :
Sinon, il me semble aussi (mais je dis peut-être une bêtise, suis néophyte en la matière) que tu pourrais passer par createElement et setAttribute pour générer ce contenu, non?

+1

Ca évitera d'avoir des problèmes si le titre contient un apostrophe par exemple.
Modifié par Julien Royer (23 Nov 2007 - 11:30)

Bonjour,

L'encadrement par des quotes de la valeur du title a résolu mon problème.

Il me reste à traiter les apostrophes qui bloque l'affichage du texte après la première apostrophe rencontrée.

Avez-vous une solution ?

Merci pour vos réponses.

Cordialement

mara a écrit :
Il me reste à traiter les apostrophes qui bloque l'affichage du texte après la première apostrophe rencontrée.

Avez-vous une solution ?

Passer par createElement et setAttribute?

Sinon, il y a peut-être des fonctions JS qui permettent d'échapper les quotes dans une chaine de caractères. À voir...

Florent V. a écrit :
Passer par createElement et setAttribute?

Encore une fois, +1...

@mara : peut-être pourrais-tu lire entièrement les réponses qui te sont données ?

Florent V. a écrit :
Sinon, il y a peut-être des fonctions JS qui permettent d'échapper les quotes dans une chaine de caractères. À voir...

A voir aussi qu'il faudra échapper les caractères "&" et ">"... Bref, on va obtenir une jolie usine à gaz là ou les fonctions du DOM auraient été bien plus pratiques.

mara a écrit :
Avez-vous une solution ?

Quelque chose comme :

var el = document.getElementById("monElement");

var img = document.createElement("img");
img.title = vTitre[ i];
img.src = vThumb[ i];
img.alt = vAlt[ i];

el.appendChild(img);

Bonjour Julien,

Merci pour la réponse, mais le béotien javascript que je suis éprouve quelques difficultés à intégrer le code que tu me proposes.

Je donne ci dessous le code complet qui m'a amené sur ce forum afin que tu puisses m'apporter des précisions.

Comment faire pour fixer la hauteur tableau d'affichage des vignettes à
"clientHeight".

Bien cordialement.


function afficheVignettes(idecale){

var content="";
var i=0; var j=0; var ch="";

//Dimensions de la fenêtre d'affichage du client
if (window.innerHeight) {
//Navigateurs sauf Explorer
var clientHeight = window.innerHeight;
var clientWidth = window.innerWidth;
}
else if (document.documentElement && document.documentElement.clientHeight) {
//Internet Explorer mode Strict
var clientHeight = document.documentElement.clientHeight;
var clientWidth = document.documentElement.clientWidth;
}
else if (document.body && document.body.clientHeight) {
//Autres Internet Explorer
var clientHeight = document.body.clientHeight;
var clientWidth = document.body.clientWidth;
}

//Nombre de vignettes
inbvignette=cImage

//La vignette de l'image affichée est maintenue en haut du tableau
if (idecale!=null && idecale !=9999 ){
iencours -= idecale;
}
if ((iencours == iImageEnCours ) && idecale== 9999){iencours=iImageEnCours+1;}
if (iencours <0){ iencours += vImage.length;}

//Affichage des vignettes dans un tableau vertical

content+="<table>";

for (j=1;j<=inbvignette;j++){

content+="<tr><td>";

i=( vImage.length +iencours - 2 + j) % vImage.length ;

//La vignette de l'image affichée est encadrée d'une bordure
if (i == iImageEnCours ) {ch="border='3' " ; }else{ch="border='0' " ;}
content=content+"<img ";
content+="onclick='javascript:allera("+i+");' title='"+(i+1)+"."+vTitre+"' "+ch+" height='50' src='"+vThumb[ i ]+"' />" ;

content+="</td></tr>";
//Signalement de la dernière vignette
if ((i+1) == vImage.length ) {
content+="<tr><td>";
content+="Fin";
content+="</td></tr>";
}
}

content+="</table>";

document.getElementById("vignettes").innerHTML = content;
document.getElementById("vignettes").style.display="";
}