Aide avec un script réduction image !!!Résolu

Question

Bonjour, je fait appel a vous car j'ai un petit problème de code. J'ai décidé d'alléger mon site et j'ai commencer par exporter tout mes code en .js externe des page. Cependant j'avais fait un script qui réduisait les image avant leurs affichage. Puis j'ai voulu le rendre automatique pour éviter d'avoir a le mettre sous chaque images. Voila le code que j'ai écrie mais rien ne marche !!!!! function reduc_image(name){ for (i=0;i<2;i++) { name = image[i]; } document.getElementsByName(name).width = Math.round(larg/coeff); document.getElementsByName(name).height = Math.round(haut/coeff); } Le code est dans un fichier externe(.js), ce que je voudrais s'est modifier la taille de l'image. Toutes mes image s'appel respectivement image1, image2, image3,... Dans l'espoir d'être claire. Merci d'avance.

@karamel · Accepted Answer

la variable name n'est pas bien defini

function reduc_image(){
for (i=0;i<2;i++) {
var name = 'image'+i;
document.getElementById(name).width = Math.round(larg/coeff);
document.getElementById(name).height = Math.round(haut/coeff);
}
}

cs_DARKSIDIOUS · Answer

Salut,

La fonction getElementsByName te renvoie un tableau d'éléments et non un seul élément. Pour ce que tu cherche à faire, je te conseille plutôt de passer par un getElementById en lui spécifiant l'id de l'image à redimensionner.
______________________________________

AVANT de poster votre message, veuillez lire, comprendre, et appliquer notre réglement

kangourouxxx · Answer

cela ne résous pas mon problème, l'image reste aussi grande.


Le nouveau scrip est :


function reduc_image(){
for (i=0;i<2;i++) {
name = image[i];
}
document.getElementById (name).width = Math.round(larg/coeff);
    document.getElementById (name).height = Math.round(haut/coeff);
}


merci de tas réponse rapide.

@karamel · Answer

function reduc_image(id_de_limage){
document.getElementById(id_de_limage).style.width = Math.round(larg/coeff);
document.getElementById(id_de_limage).style.height = Math.round(haut/coeff);
} 


la boucle for ne servait a rien ou alors elle est mal construite car si je me trompe pas tu doit parcourir toutes images concerné et il y avait un espace en trop (document.getElementById (name))

il manque aussi une valeur c'est le coeff

kangourouxxx · Answer

Si la boucle for sert a quelque chose car toute mes images se nomme (id) image1, image2, image3, ...
donc en faisan une boucle avec for pour incrémenter i de 1 a chaque passage j'obtiens bien un id pour mes images : image1, image2, image3,...

Je te remercie de ton aide mais pourrais tu me dire ce qui ne vas pas ?

Je pense avoir trouvé ! je teste et vous redit sa.
Merci de votre aide.

kangourouxxx · Answer

Salut Kazma, la correction que tu mas indiqué est l'erreur que je pensais avoir trouvé.
Cependant aucun changement, donc je fait encore une fois appel a vous membre de CS.
le code est le suivant :

function reduc_image(){
for (i=0;i<10;i++) {
name='image'+[i];
}
document.getElementById(name).style.width=Math.round(larg/coeff);
        document.getElementById(name).style.height=Math.round(haut/coeff);
}

@karamel · Answer

oui mais dans ce que tu met tu fait toujour l'erreur si la variable la bonne syntaxe est

var name = 'image'+i;


le mot var sert a declarer une variable local

pour te rendre compte de ton erreur mets une alert pour voir ce que retourne la variable

pour ton exemple

function reduc_image(){
    for (i=0;i<10;i++) {
        name='image'+[i];
alert(name)
    }
    document.getElementById(name).style.width=Math.round(larg/coeff);
        document.getElementById(name).style.height=Math.round(haut/coeff);
}

kangourouxxx · Answer

Correction effectué mais cela ne change pas mon problème.
Mes image ne se réduisent pas !
Probablement l'ai-je mal appelé dans la page.
je l'ai mis dans la balise  dans l'attribut "OnLoad=..."

donc mon code est le suivant:

function reduc_image(){
for (i=0;i<10;i++) {
name='image'+i;
}
document.getElementById(name).style.width=Math.round(larg/coeff);
        document.getElementById(name).style.height=Math.round(haut/coeff);
}

kangourouxxx · Answer

Bon bas s'est bon j'ai fini par trouver le problème.
Je vous remercie de votre coup de main.

Kangouroux

PetoleTeam · Answer

Bonjour,
ce qui serait sympa c'est qu'après avoir était aidé tu nous fasses part de ta solution et que tu la mettes en Réponse acceptée, cela pourra en aidé d'autres...

;O)

kangourouxxx · Answer

En faite, la correction il y en a deux.
La première supprimer .style de mon argument getElementById.
Car cela ne fonctionne pas du tout.
Ensuite remettre mes deux argument dans la boucle For (car on sort de la boucle que quand I a atteint le nombre d'image !!!)

En tout cas merci beaucoup pour votre aide.


function reduc_image(){
for (i=1;i<=15;i++) {
       name='image'+i;
       document.getElementById(name).width=Math.round(larg/coeff);
    	       document.getElementById(name).height=Math.round(haut/coeff);
}
}


P.S : Après teste "i" et "[i]" sa ne change que la syntaxe rien d'autre.

PetoleTeam · Answer

Bonjour,
P.S : Après teste "i" et "[i]" sa ne change que la syntaxe rien d'autre.
pas exactement mais le résultat est le même, je dirais que tu mets le contenu d'un tableau qui vaut effectivement i...

La première supprimer .style de mon argument getElementById. 
cela dépendra de la façon de déclarer, ou non, la hauteur et la largeur des images au départ...

Haut et Larg définis dans le CSS (style)
- appel height et width -> ne marche pas
- appel style.height -> MARCHE
Haut et Larg définis, ou non, dans balises avec les attributs
- les deux MARCHENT
...donc autant mettre style.height, avec l'unité px...

Enfin, si je peux me permettre plusieurs remarques sur le bout de code

- Math.round(larg/coeff) doit être calculé en dehors de la boucle, pourquoi le recalculer à chaque fois, idem pour Math.round(haut/coeff).

- document.getElementById(name) pourquoi ne pas utiliser la collection document.images mise à disposition par les navigateurs ?

- for (i=1;i<=15;i++) {, ce genre de boucle, avec bornes définies n'est pas top, si tu rajoutes ou enlève des images il te faut retoucher les valeurs de la boucle.

j'aurais fait un truc dasn ce style
//-------------------
function Resize_IMG(){
  //-- Nouvelles valeurs
  var Larg = Math.round( larg/coeff);
  var Haut = Math.round( haut/coeff);
  //-- Indice de depart
  var Ind  = 1;
  //-- Les images doivent avoir un name ou une id
  while( Obj = document.images[ "image" +Ind++]){ // affectation, incrementation
      Obj.style.height = Haut +"px";
      Obj.style.width  = Larg +"px";
    }
  }
}
en gros ....

/color;O)

Aide avec un script réduction image !!!

12 réponses

Votre réponse

Discussions similaires