fonction bordure avec <td> et <div> (+<a>)
Actuellement j'utilise une fonction dans un *.js paliant le non fonctionnement de
td.bouton:active en CSS avec IE :
*.css
Code:
.bouton { background:#FAEA92 url(bgbtyr.jpg); border:4px outset; color:#FFFFFF; }
*.js
Code:
1 2 3 4 5 6 7 8 9 10 11 12
| function bordure(bouton)
{
boutonElements=document.getElementsByTagName('td')
for (b=0;b<boutonElements.length;b++){
if(boutonElements[b].className==bouton){
boutonElements[b].onmousedown=function(){this.style.borderStyle='inset';} //Activé
boutonElements[b].onmouseup=function(){this.style.borderStyle='outset';} //Relaché
boutonElements[b].onmouseout=function(){this.style.borderStyle='outset';} //Hors zone
}
}
}
window.onload = function(){bordure('bouton')}; |
Elle fonctionne parfaitement avec juste <td class="bouton"> :
*.html
Code:
1 2 3 4 5
| <table>
<tr>
<td class="bouton"><a href="index.php">Acceuil</a></td>
</tr>
</table> |
Je veut que ça puisse aussi fonctionner aussi simplement en faisant:
*.html
Code:
<div class="bouton"><a href="index.php">Acceuil</a></div>
Ce que je demande c'est que la fonction bordure soit identifiée dans les pages
html par la présence de l'attribut td ou div avec la valeur bouton dans la balise.
Rien de plus rien de moin.
Merci d'avance :) !