Afficher une image avec javascript

Fermé
Claudius - 4 janv. 2009 à 20:33
 claude - 6 janv. 2009 à 18:00
Bonjour,
Sur une page .htm sur laquelle se trouve déjà une image (dans l'exemple, c'est "ange13.gif"), je souhaite afficher ne image supplémentaire quelques secondes après l'affichage de cette page.
Or, l'image supplémentaire "ange14.gif" s'affiche bien, mais tout ce qui est au préalable sur la page est masqué !
Quelle instruction permet de visionner l'ensemble ?

Voici le script de l'ensemble. Faites l'essai sur une page .htm vierge.

<html>
<head>
<title>Essai d'incrustation d'image</title>

<SCRIPT LANGUAGE="Javascript">
function start()
{
//essai d'affichage de l'image supplémentaire qui s'affiche à gauche après un délai de 3 secondes
document.writeln('<img border="0" src="matos_voeux_b_annee/ange14.gif" width="80" height="80">')
}
</SCRIPT>

</head>


<body>

<!--L'image suivante est en place sur la page. Elle s'affiche à droite de l'écran-->
<img border="0" src="matos_voeux_b_annee/ange13.gif" width="80" height="80" align="right">

<script language="JavaScript" type="text/javascript">
comp=(setTimeout("start()",3000));
</script>

</body>
</html>

<!--REMARQUE: On constate que la nouvelle image masque tout le reste de l'écran.
Comment l'incruster dans la page afin que ce qui s'y trouve déjà reste visible ?
-->

MERCI.

1 réponse

Pour ce faire vous devez utiliser une balise <div> et sa propriété innerHTML liée à un identifiant

Dons dans votre balise <body>
ecrire:
<div id="maBalise">
insérer ici le code pour votre première image
</div>


puis dans un script dans la balise <head> mettre une fonction du type

fonction ajouteImage(){
var identifiant = document.getElementById("maBalise");
var ecrire = "<img src='firstImage.gif'>";
ecrire += "<img src='secondeImage.gif'>"; //attention code html
identifiant.innerHTML = ecrire; //ecrit dans votre balise div le code HTML
}


Part ailleurs pour réaliser un fonction d'attente type sleep allez à l'adresse:
http://jpconnexion.free.fr/divers_fr/divers15_wait_sleep_pause.html

si vous rencontrer des problèmes me contacter : claudecnx@blanquefort.net
1