Comment faire pour redimensionner une image avec onmouseover et
Résolu
Nikolbc66
-
Nikolbc66 -
Nikolbc66 -
Bonjour,
J'aimerais savoir comment je peux faire pour changer les dimensions d'une image (la rendre plus grosse...) avec le bout de programme qui suit ?
<td id="td_fond_image"><?php echo $info_auteur['liste'][0]->NOM ;?>
<br />
<span class="dates_auteur">(<?php echo $info_auteur['liste'][0]->DATES ;?>)</span>
<br />
<div id="img_focus" <!-- style="position:relative;width:50%;height:50%;" -->
<img id="image_poete" style="position:absolute;top:50%;left:50%;" src="images/<?php echo $info_auteur['liste'][0]->CODE ;?>.jpg" onmouseout = 'src="images/<?php echo $info_auteur['liste'][0]->CODE ;?>.jpg"' onmouseover = 'src="images/grandes/<?php echo $info_auteur['liste'][0]->CODE ;?>_g.jpg"' alt="<?php echo $info_auteur['liste'][0]->CODE ;?>.jpg"/>
</div>
</td>
Merci d'avance
J'aimerais savoir comment je peux faire pour changer les dimensions d'une image (la rendre plus grosse...) avec le bout de programme qui suit ?
<td id="td_fond_image"><?php echo $info_auteur['liste'][0]->NOM ;?>
<br />
<span class="dates_auteur">(<?php echo $info_auteur['liste'][0]->DATES ;?>)</span>
<br />
<div id="img_focus" <!-- style="position:relative;width:50%;height:50%;" -->
<img id="image_poete" style="position:absolute;top:50%;left:50%;" src="images/<?php echo $info_auteur['liste'][0]->CODE ;?>.jpg" onmouseout = 'src="images/<?php echo $info_auteur['liste'][0]->CODE ;?>.jpg"' onmouseover = 'src="images/grandes/<?php echo $info_auteur['liste'][0]->CODE ;?>_g.jpg"' alt="<?php echo $info_auteur['liste'][0]->CODE ;?>.jpg"/>
</div>
</td>
Merci d'avance
2 réponses
-
Bonjour, peut etre qu'en attribuant un id a ton image et dans le css mettre :
.idimage:hover{ width : plusgrand height : plusgrand }
-
Je vais essayer de suite. Merci pour le petit coup de main... Je voulais le faire sans CSS car ma page CSS est assez conséquente mais, il faut ce qu'il faut. Je travaille actuellement sur le site "Métrique en ligne" que tu peux aller voir en tapant le nom dans ton navigateur : la version qui s'y trouve est l'ancienne version.
-
-
-
Bonjour,
Trois ligne de CSS ne changerons pas grand chose et ceci influe sur le temps de chargement de la page qui, de toute façon, devra charger plus de js avec ta solution. L'un dans l'autre ...
je te met un exemple CSS:<style> div.monelement { width: 200px; height: 100px; background-color: yellow; transform:scale(1); transition:transform 1s ease; } div.monelement:hover { transform:scale(2); } </style>
Tu t'en sert ou pas , il sera utile pour d'autre je pense.
Attention, compatibilité navigateur récent (tant pis pour les fans d'IE6)
