> 
- Home Page
- > Script DHTML
- > Script DHTML Links
- > Link con sfondo che cambia colore
Link con sfondo che cambia colore
Link con lo sfondo che cambia colore quando ci passiamo sopra con il mouse.
<HTML><HEAD><TITLE>TITOLO</TITLE>
<STYLE type=text/css>
A {
FONT-WEIGHT: bold; FONT-SIZE: 10pt; LINE-HEIGHT: normal; FONT-FAMILY: Arial,Helvetica,sans-serif;
TEXT-DECORATION: none
}
A:hover {
COLOR: #660066; BACKGROUND-COLOR: #ffcccc
}
</STYLE>
<SCRIPT language=JavaScript>
// Emulazione dell'effetto link hover di IE in NS.
var hoverBgColor = "#ffcccc"; // Copiato dall'IE una:hover definizione.
var hoverColor = "#660066";
function hover(layer) {
var link, str;
// Crea un sub-layer copiando il link in questo e cambiando
// sfondo e colori del testo.
link = layer.document.links[0];
str = '<a href="' + link.href + '"';
if (link.target)
str += ' target= "' + link.target + '"'
str += '><font color="' + hoverColor + '">' + link.text +
'</font>';
layer.hoverLayer = new Layer(layer.clip.width, layer);
layer.hoverLayer.document.open("text/html", "replace");
layer.hoverLayer.document.write(str);
layer.hoverLayer.document.close();
layer.hoverLayer.bgColor = hoverBgColor;
// Mostra il layer hover iniziale.
layer.hoverLayer.visibility = "show";
// Metti un evento da catturare su questo layer per la visibilità del
// sub-layer.
layer.onMouseOver = hoverOn;
layer.onMouseOut = hoverOff;
}
function hoverOn() {
this.hoverLayer.visibility = "show";
}
function hoverOff() {
this.hoverLayer.visibility = "hide";
}
</SCRIPT>
<BODY>
<BR><BR><FONT face=Arial,Helvetica size=2>
<ILAYER><LAYER onmouseover=hover(this);><A href="#">LINK1</A></LAYER></ILAYER><BR>
<ILAYER><LAYER onmouseover=hover(this);><A href="#">LINK2</A></LAYER></ILAYER><BR>
<ILAYER><LAYER onmouseover=hover(this);><A href="#">LINK3</A></LAYER></ILAYER><BR>
</BODY></HTML>
