Objets :Objet image Javascript
Un article de WikiTuto.
Sommaire |
Explication
L'objet image existe pour toute page Web contenant au moins une image. Les images sont contenus dans un vecteur où l'ordre d'index des images correspond à leur position dans la page web.
Grâce à l'index d'une image, il est possible d'obtenir des informations sur cette dernière telles que ses dimensions, la largeur de sa bordure, son nom, ses attributs d'espacement, sa source. L'objet image ne possède pas de méthode, mais il reste possible de modifier ses propriétés.
Une autre propriété de l'objet image est complete. Il s'agit d'une valeur booléenne qui est à false tant qu'une image n'est pas chargée puis passe à true lorsqu'elle l'est.
Préchargement de l'image
À l'aide d'un objet image, il est possible de précharger une image en mémoire pendant le chargement initial de la page. Une fois l'image préchargée, JavaScript peut faire référence à l'objet image et l'afficher immédiatement.
Pour créer un objet image vous devez faire une variable qui recevra l'image et ensuite faire appel au constructeur avec le mot clé new. Puis il faut modifier les propriétés de l'objet comme src, border et hspace.
Exemple
<head>
<script language="JavaScript">
// Création d'un objet image
var PhotoDragon= new Image();
// Ajustement des propriétés de l'objet avec celles désirées
PhotoDragon.src= "Dragon.jpg";
PhotoDragon.border= 8;
</script>
</head>
// On dit ici qu'au chargement de la page on doit modifier les sources des images
<body onload="document.Images[0].src= PhotoDragon.src">
// Emplacement de la photo ,
pour Netscrape il faut préciser à cet endroit la largeur et la hauteur
<img src width="170" height="300">
</body>
