11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

j'ai un petit code js qui agrandit une image au passage sur un lien:

[code=javascript]<HTML>
<HEAD>
<SCRIPT LANGUAGE=JavaScript>
function ouvre()
{ temoin=1;
     
     if(document.getElementById)
      {
        hautimage -=5;
        gaucheimage -=8;
        haut +=10;
        larg +=16;
        document.getElementById("smile").style.top = hautimage;
        document.getElementById("smile").style.left = gaucheimage;
        document.getElementById("smile").style.height = haut;
        document.getElementById("smile").style.width = larg;

        if (larg < 200)
         {setTimeout('ouvre()', 10);}
        }temoin=0;}
       
</SCRIPT>


<SCRIPT LANGUAGE=JavaScript>
function ferme()
{ temoin=1;
     
     if(document.getElementById)
      {
        hautimage +=5;
        gaucheimage +=8;
        haut -=10;
        larg -=16;
        document.getElementById("smile").style.top = hautimage;
        document.getElementById("smile").style.left = gaucheimage;
        document.getElementById("smile").style.height = haut;
        document.getElementById("smile").style.width = larg;

        if (larg >0)
         {setTimeout('ferme()', 10);}
        }temoin=0;}
       
</SCRIPT>
</HEAD>
<Body>

<SCRIPT LANGUAGE="javascript">
var hautimage = (screen.width/4)-50;
var gaucheimage = (screen.width/2)-75;
var haut = 100;
var larg = 150;
var temoin=0

document.write('<IMG SRC="Certifcapacite.jpg"  height=0;  width=0;  ID=smile STYLE="position:absolute;top:'+hautimage+';left:'+gaucheimage+'">');
</SCRIPT>
<a href="#" onmouseover="ouvre()"  onmouseout="ferme()">Survolez pour ouvrir</a>

</BODY>
</HTML> 


Ca marche bien. mais si je déclare un Doctype html strict, ça ne marche plus, la fonction ouvre() est bien appelée (j'ai testé avec un petit message d'alerte en début de fonction) mais
l'image ne s'affiche pas. J'ai bie fait quelques ajustements pour être à priori plus conforme mais rien n'y fait et là j'aurai vraiment besoin d'aide SVP:
Code qui ne marche pas:
[code=javascript]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">


<html>
<head>
<script type="text/javascript">
function ouvre(){ 
temoin=1;
     
     if(document.getElementById)
      {
        hautimage -=5;
        gaucheimage -=8;
        haut +=10;
        larg +=16;
        document.getElementById("smile").style.top = hautimage;
        document.getElementById("smile").style.left = gaucheimage;
        document.getElementById("smile").style.height = haut;
        document.getElementById("smile").style.width = larg;

        if (larg < 200)
         {setTimeout('ouvre()', 10);}
        }temoin=0;}
       
</script>


<script type="text/javascript">
function ferme()
{ temoin=1;
     
     if(document.getElementById)
      {
        hautimage +=5;
        gaucheimage +=8;
        haut -=10;
        larg -=16;
        document.getElementById("smile").style.top = hautimage;
        document.getElementById("smile").style.left = gaucheimage;
        document.getElementById("smile").style.height = haut;
        document.getElementById("smile").style.width = larg;

        if (larg >0)
         {setTimeout('ferme()', 10);}
        }temoin=0;}
       
</script>
</head>

<body>

<script type="text/javascript">
var hautimage = (screen.width/4)-50;
var gaucheimage = (screen.width/2)-75;
var haut = 100;
var larg = 150;
var temoin=0

document.write('<img  src="Certifcapacite.jpg"  height=0px;  width=0px;  ID=smile style="position:absolute;top:'+hautimage+'+'px';left:'+gaucheimage+'+'px'"></img>');
</script>

<a href="#" onmouseover="ouvre()"  onmouseout="ferme()">Survolez pour ouvrir</a>

</body>
</html> 


Merci pour votre aide

A+
Philippe