Se connecter / S'enregistrer

Résolu agrandir des images dans une division(javascript)

Solutions (1)
Tags :
  • black
|
j'ai un exercice en javascript qui consiste a realiser 4 division la premiere contient 4 images en cliquant sur une de ses images elle s'affiche dans la division qui est juste au dessous avec une taille plus grande
mais je n'arrive pas a realiser cette tache c'est mon code

<html>
<head>

<style>
p {
text-align: right;
}
p span {
float: left;
}
.header {
float : left;
text-align: center;
font-weight: bold;
height :100;
width: 1000;
}
.header1 {
float : left;
text-align: center;
font-weight: bold;
height :100;
width: 1000;
}
.body {
float : left;
border: solid 1px black ;
height :500;
width: 996;
}
.body1 {
float : right;
border: solid 1px black ;
font-weight: bold;
height :500;
width: 1000;
}
.b {
background: #F0F7FA;
}

.Box {
border: solid 3px black ;
width: 2000;
height :1100;
}
.image {
cursor: pointer;
position:relative;
top :250;
left: 100;
}
.image1 {
cursor: pointer;
position:relative;
top :250;
left: 250;
}
.image2 {
cursor: pointer;
position:relative;
top :250;
left: 400;
}
#img1{
width: 100 ;
height:100; }
</style>
<script language="javaScript">
function f1(){
var a=document.getElementById('img1').style;

if((a.width=="300px")&&(a.height="300px")){
a.width="100px";
a.height="100px";
}
else{
a.width="300px";
a.height="300px";
}
}



</script>

</head>
<body>
<div class="box">
<div id="menuhaut"><p><span>Photo</span>Video</p></div>
<div class="body" onclick="f1()" id="vers1">
<table>
<tr>
<td><img src="1.JPG" id="img1" class="image" /></td>
<td><img src="2.JPG" id="img1" class="image1" /></td>
<td><img src="3.JPG" id="img1" class="image2" /></td></tr></table>
</div>
<div class="body1">
bonjour
</div>
<div class="body" ><a href="#vers1">
nom + #</a>
</div>
<div class="body1">
nom1 + nom2
</div>

</div >

</div>
</body>
</html>
Contenus similaires
Meilleure solution
partage
, Modérateur |
Un truc du genre (il faut ajouter des IDs à tes <a> :
  1. document.getElementById('vers1').innerHTML = '<img src="1.jpg" class="image" />';
  • Dreamcaster 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