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
A voir également:
- Comment faire pour redimensionner une image avec onmouseover et
- Image iso - Guide
- Légender une image - Guide
- Comment faire une recherche par image - Guide
- Comment agrandir une image - Guide
- Comment redimensionner une image - Guide
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
}
Nikolbc66
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.
Nikolbc66
J'ai testé, mais ça ne marche pas. Pourquoi ? Mystère !!! Je ne sais pas trop comment je vais faire pour ne pas avoir à changer une bonne partie de mon programme... J'aurais vraiment aimé que ça marche : ça m'aurait fait un bug de moins à traiter... ; )
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:
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)
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)