Fonction: Bordure Inset/Outset, Version debuguée :) !
J'ai remarquée un petit bug dans ma fonction. En fait, si je clique sur la bordure,
elle reste bloquée en position enfoncée :? ... Du coup j'ai rajouté une ligne :) :
Code:
boutonElements[b].onmouseout=function() {this.style.borderStyle='outset';} //Hors zone
Pour que le bouton remonte lorsque le pointeur n'est plus dans sa zone.
Voici donc ma dernière version optimisé en date :P !
*.css
Code:
.bouton { background:#codecouleur url(image.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')}; |
*.(x)html
Code:
<td class="bouton"><a href="index.php">Acceuil</a></td>
Encore merci à SpaceFrog pour la conception du Script, et denisC
pour la fonction de préchargement de la fonction externe :bravo: !
