Version imprimable
Bonjour à tous,
voilà j'ai récupérer un code d'un mouvement de souris sur des liens de news qui produit un changement d'affichage de l'image selon le titre survolé.
Je mets le code tel quel, parce que j'ai dument essayé de changer le code (supprimer les balises obsolètes, fermer les balises ...) mais voila tout changement apporté va déformer la page résultante :roll:
Alors j'aimerais bien avoir le code écrit selon les normes, sans bousier l'affichage du mouvement voulu.
Merci d'avance.
Bonjour,
le problème que ce code vient ainsi dans l'index du site, et il fonctionne trés bien :
On peux voir deux balises HTML et deux BODYCode:<!ENTITY % HTMLspecial PUBLIC "-//W3C//ENTITIES Special//EN//HTML" "http://www.w3.org/TR/REC-html40-971218/HTMLspecial.ent"> <HTML><head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <meta http-equiv="Content-Language" content="fr"> <META content="ALL" name="ROBOTS"> <META NAME="REVISIT-AFTER" CONTENT="1 DAYS"> <META NAME="RATING" CONTENT="GENERAL"> <title></title> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <link rel="stylesheet" type="text/css" href="html/css/asd.css"> <script language="javascript" type="text/javascript"> function mail(user, domain){window.location = 'mailto:'+user+'@'+domain;} </script><script language="JavaScript" type="text/javascript"> function rafiawin(external, height, width) { options = 'height=' + height + ',width=' + width + ',scrollbars=yes,resizable=yes,top=0,left=0'; window.open(external, 'rafia', options); } function fermer() { self.close(); } </script> </head> <body bgcolor="#515773"> ..... <p></p> <p></p> <html> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252> <script language="JavaScript1.2"> var ns6=document.getElementById&&!document.all var ie=document.all function changeto(e,highlightcolor){ source=ie? event.srcElement : e.target if (source.tagName=="TR"||source.tagName=="TABLE") return while(source.tagName!="TD"&&source.tagName!="HTML") source=ns6? source.parentNode : source.parentElement if (source.style.backgroundColor!=highlightcolor&&source.id!="ignore") source.style.backgroundColor=highlightcolor } function contains_ns6(master, slave) { //check if slave is contained by master while (slave.parentNode) if ((slave = slave.parentNode) == master) return true; return false; } function changeback(e,originalcolor){ if (ie&&(event.fromElement.contains(event.toElement)||source.contains(event.toElement)||source.id=="ignore")||source.tagName=="TR"||source.tagName=="TABLE") return else if (ns6&&(contains_ns6(source, e.relatedTarget)||source.id=="ignore")) return if (ie&&event.toElement!=source||ns6&&e.relatedTarget!=source) source.style.backgroundColor=originalcolor } </script> </head> <body> <div align="center"> <table border="0" cellpadding="0" style="border-collapse: collapse" width="350"> <tr> <td align="center" width="100%" height="111" valign="top"> <style type="text/css"> a { color: blue; text-decoration: none; } a:hover { color : red; text-decoration: none; } div { font-family: verdana; } </style> <div align="center"> <table border="0" cellpadding="0" style="border-collapse: collapse" width="100%"> <tr> <td width="150" align="center" valign="top"> <p align="center"></p> <div id="a" style="display: none;"> <p dir="ltr"> <table border=0 width=98%><table border=0 width=98%> <table border="0" cellpadding="0" style="border-collapse: collapse" width="145" height="110"> <tr> <td> <p align="center"><a target="_parent" href="news.php?action=view&id=55"> <img border="0" src="filemanager.php?action=image&id=<img width=150 height=122 border =0 align=center src=filemanager.php?action=image&id=58 >" width="150" height="122"></a></td> </tr> </table> </p> </div> <div id="b" style="display: none;"> <p dir="ltr"> <table border=0 width=98%><table border=0 width=98%> <table border="0" cellpadding="0" style="border-collapse: collapse" width="145" height="110"> <tr> <td> <p align="center"><a target="_parent" href="news.php?action=view&id=51"> <img border="0" src="filemanager.php?action=image&id=<img width=150 height=122 border =0 align=center src=filemanager.php?action=image&id=54 >" width="150" height="122"></a></td> </tr> </table> </p> </div> <div id="c" style="display: none;"> <p dir="ltr"> <table border=0 width=98%><table border=0 width=98%> <table border="0" cellpadding="0" style="border-collapse: collapse" width="145" height="110"> <tr> <td> <p align="center"><a target="_parent" href="news.php?action=view&id=41"> <img border="0" src="filemanager.php?action=image&id=<img width=150 height=122 border =0 align=center src=filemanager.php?action=image&id=43 >" width="150" height="122"></a></td> </tr> </table> </p> </div> </td> <td align="right"> <div align="center"> <table border="1" cellpadding="0" style="border-collapse: collapse" width="100%" id="table1" bordercolor="#9DAABF" onmouseover="changeto(event, '2e3b60')" onmouseout="changeback(event, '728cb7')"> <tr> <style type="text/css"> a { color: blue; text-decoration: none; } a:hover { color : red; text-decoration: none; } div { font-family: verdana; } </style> <script language="javascript"> var speed="1"; var i=1; function showNews() { if (i==1){show(a,b,c);i=0} } function show(a,b,c) { a.style.display = ''; b.style.display = 'none'; c.style.display = 'none'; } setInterval("showNews()", speed*2000); </script> <td bgcolor="#728cb7" align="center" width="100%" height="40"> <p dir="ltr"> <table border=0 width=98%><a href="javascript:void(0)" onmousemove="javascript:show(a,b,c)"> <font color="#000000"> <table border=0 width=98%> <div align="center"> <table border="0" cellpadding="0" style="border-collapse: collapse" width="96%"> <tr> <td id="ignore"> <font face="Tahoma" style="font-size: 9pt" color="#FFFFFF"> <a target="_parent" href="news.php?action=view&id=55"><font color="#FFFFFF">Articles 1</font></a></font></td> </tr> </div> </table> </font></a></p> </td> </tr><tr> <tr> <td bgcolor="#728cb7" align="center" width="100%" height="40"> <p dir="ltr"> <table border=0 width=98%><a href="javascript:void(0)" onmousemove="javascript:show(b,c,a)"> <font color="#000000"> <table border=0 width=98%><div align="center"> <table border="0" cellpadding="0" style="border-collapse: collapse" width="96%"> <tr> <td id="ignore"> <font face="Tahoma" style="font-size: 9pt" color="#FFFFFF"> <a target="_parent" href="news.php?action=view&id=51"><font color="#FFFFFF">Articles 2</font></a></font></td> </tr> </div> </table> </font></a></p> </td> </tr> <tr> <td bgcolor="#728cb7" align="center" width="100%" height="40"> <p dir="ltr"> <table border=0 width=98%> <a href="javascript:void(0)" onmousemove="javascript:show(c,a,b)"> <font color="#000000"> <table border=0 width=98%><div align="center"> <table border="0" cellpadding="0" style="border-collapse: collapse" width="96%"> <tr> <td id="ignore"> <font face="Tahoma" style="font-size: 9pt" color="#FFFFFF"> <a target="_parent" href="news.php?action=view&id=41"><font color="#FFFFFF">Articles 3</font></a></font></td> </tr> </div> </table> </font></a></p> </td> </tr> </div> </div> </td> </tr> </table> </div> </td> </tr> </table> </div> </body> </html> </tr> </table> </div> </div> <p></p> <p></p> .... </body> </html>
Je l'ai fait passer dans W3C Validator et il est plein d'erreurs ...
J'ai pu corriger quelques uns.
j'ai essayé de modifier le code en supprimant les doublons des balises HTML, BODy et HEAD en deplaçant le "Javascript 1.2" situé dans le deuxieme HEAD dans le HEAD principal du site.
mais voila la page ne s'affiche plus.
Est-ce qu'il y'a une façon pour l'aisser le javascript ou est il tout en supprimmant les balises en double ?
Sinon comment récuperer le code de l'effet survol de la souris sur les liens des news pour l'affichage en face de l'image de ce news ?
Merci.
Merci.