Résolu agrandir et diminuer la taille d'une image javascript(DOM)

Solutions (1)
Tags :
  • Input
  • Html
  • Script
|
j'ai l'exercice suivant
Soit le code suivant :
<html><head><script>
function agrandir()
{………..}
function diminuer()
{…….}
</script> </head><body>
<img src='image1.jpg' id='i1' width='100' height='100' />
<input type='button' name='plus' value='agrandir' onclick='agrandir()'/>
<input type='button' name='moins' value='diminuer' disabled='disabled' onclick='diminuer()'/>
</body></html>
Même principe que l’exercice 2, tout en ajoutant un bouton pour diminuer la taille de l’image.
Il est donc demandé de compléter les fonctions par le code javascript necessaire de sorte qu’un click
sur le bouton agrandir permet de doubler la taille de l’image (hauteur et largeur) et qu’un click sur le
bouton minimiser permet de diviser la taille de l’image par 2 (hauteur et largeur). La taille minimale de
l’image est 100/100 et la taille maximale est 800/800.
Mon code est le suivant:
<html><head><script>
function agrandir()
{var a=document.getElementById('i1').width.value;
var b=document.getElementById('i1').height.value;
a =a*2;
b =b*2;}
function diminuer()
{var a=document.getElementById('i1').width.value;
var b=document.getElementById('i1').height.value;



a=a/2;
b=b/2;
document.getElementById('btn1').disabled =true ;
document.getElementById('btn2').disabled =false ; }
</script> </head><body>
<img src='bebe.jpg' id='i1' width='200' height='200' />
<input type='button' name='plus' id='btn1' value='agrandir' onclick='agrandir()'/>
<input type='button' name='moins' id='btn2' value='diminuer' disabled='disabled' onclick='diminuer()'/>
</body></html>
=>Mais ceci ne fonctionne plus
svp aidez moi a resoudre ce probléme
Contenus similaires
Meilleure solution
partage
, Modérateur |
Plusieurs erreurs, il faut utiliser "width" tout court et pas "width.value". idem pour height

Ensuite, quand tu fais :
  1. var a = document.getElementById('i1').width.value

tu copies la valeur dans une variable "a"; si tu modifies la variable "a", ça ne modifie pas la valeur de l'image
  • twiti19 a sélectionné cette solution comme la meilleure réponse
  • Commenter cette solution |

Ce n'est pas ce que vous cherchiez ?

Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS