|
[ Forums >> Webmasters >> Général >> Correction d'un code ]
| > Correction d'un code |
[ Posté par apz ] [ Détails ] [ Contact ] [ Citer ]
[ Posté le 05-12-2009 à 02:37 | 9 messages ]
|
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
Alors j'aimerais bien avoir le code écrit selon les normes, sans bousier l'affichage du mouvement voulu.
Pour cela j'aimerais bien :
- Avoir quelques pistes pour bien corriger ce code du genre ( tu n'as pas besoin de ça, tu peux remplacer ceci par cela ..)
- Me faire savoir si cet effet de souris existe quelques part comme un exemple ou un site l'utilisant.
Merci d'avance.
| <!ENTITY % HTMLspecial PUBLIC "-//W3C//ENTITIES Special//EN//HTML" "http://www.w3.org/TR/REC-html40-971218/HTMLspecial.ent"> <html dir="ltr"> <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"> 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); </style> <script language="javascript"> a { color: blue; text-decoration: none; } a:hover { color : red; text-decoration: none; } div { font-family: verdana; } </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> |
|
|
|
[ Posté par apz ] [ Détails ] [ Contact ] [ Citer ]
[ Posté le 05-12-2009 à 11:54 | 9 messages ]
|
A nouveau :
<!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>
<script language="JavaScript1.2" type="text/javascrip">
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" type="text/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> |
|
| [ Posté par #:-{)% ] [ Détails ] [ Contact ] [ Citer ]
[ Posté le 05-12-2009 à 15:44 | 2548 messages ]
ah, bin, çà va mieux là
petit conseil pour tes débugages, sers-toi de firefox et de sa console d'erreur, çà donne de bonnes indications sur les... erreurs, et aussi d'1 éditeur de texte digne de ce nom avec coloration syntaxique, c'est le pied. Quand j'étais sous win, je me servais de editpad, mais notepad++ est pas mal non plus
revenons à nos moutons :
* il manque 1 " dans le meta ==> content="text/html; charset=windows-1252" <== là
* type="text/javascrip" <== manque 1 t ?
* ligne 10, mettre 1 retour-chariot après le return pour que while soit sur 1 nouvelle ligne
* ligne 23, idem mais pour 1 if
j'ai pas compris pour le show(a,b,c), a, b et c n'existe nulle part, ni en ID, ni en NAME, ni même en VAR
________________
Oubli du BBcode, rééditer!
barbe-sauvage ex Mozopiens devenu renard de feu... et un peu konq sur les bords
Les OG et les DR, je M pas :/
| [ Posté par apz ] [ Détails ] [ Contact ] [ Citer ]
[ Posté le 05-12-2009 à 22:49 | 9 messages ]
Salut,
pour le show(a,b,c) c'est pour permuter l'affichage des images correspondantes au liens des articles survolés, et a,b et c, se sont les identificateurs des DIV qui engloberont les images.
donc on peut trouver ces trois lignes :
Ligne 41 :
| <div id="a" style="display: none;"> |
|
Ligne 54 :
| <div id="b" style="display: none;"> |
|
Ligne 67 :
| <div id="c" style="display: none;"> |
|
[Message édité par apz le 05-12-2009 à 22:51]
|
|
Services email :
Vous devez vous identifier pour profiter des services par email du forum.
|
|
]
