Menu

<html>
<head>
<title>Et mouseover farveskift-eksempel</title>

<script type =text/javascript>
var aktiv = \'\';
var farve = new Array(\'#112233\',\'#667788\',\'#ddeeff\');
var diver = 4;

function klik(denne){
//    alert(\'document.all.div0 = \' + document.all.div0?true:false );
  for (i=0;i<diver;i++){
    eval(\'document.all.div\'+i+\'.style.backgroundColor=farve[0]\');
  }
  denne.style.backgroundColor=farve[2];
  aktiv = denne.id;
}

function musInd(denne){
  if (denne.id==aktiv)return;
  denne.style.backgroundColor=farve[1];
}

function musUd(denne){
  if (denne.id==aktiv)return;
  denne.style.backgroundColor=farve[0];
}
</script>
</head>

<body>


<div id=div0 style=\'position:absolute;top:10;left:10;width:100;heigth:30;backgroud-color:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
Menu 1
</div>

<div id=div1 style=\'position:absolute;top:50;left:10;width:100;heigth:30;backgroud-color:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
Menu 2
</div>

<div id=div2 style=\'position:absolute;top:90;left:10;width:100;heigth:30;backgroud-color:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
Menu 3
</div>

<div id=div3 style=\'position:absolute;top:130;left:10;width:100;heigth:30;backgroud-color:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
Menu 4
</div>

</body>
</html>

hth
jes

Ps.
Jeg nåede ikke at kigge på .css-værdien background-color, den kommer lige om lidt. ;·]

en anden måde at implementere det:
http://hjem.get2net.dk/Jakob.Aggernaes/temp/exp109352.html

der er da ikke nogen \"backgroundColor\" i style. Det hedder bare \"background\"

mvh JakobA

>>jakoba
Ahh, ja, der var den!!

Til style-attributten i taggene, men javascript-objektet style har skam netop backgroundColor, da background bruges til \'combination values\':

backgroundAttachment || backgroundColor || backgroundImage || backgroundPosition || backgroundRepeat

hth
jes

Altså f.eks.
objekt.stylebackground=\"scroll url(bricks.jpg) repeat-x\"

Ok. vidste jeg ikke. Det bliver fra IE5 og op ikke?

mvh JakobA

Næeh ...
Måtte lige konsultere bibelen:
IE/Windows: 4
IE/Mac: 4
NN: 6
W3C CSS2: Yes

Og en lille tavetosse i eksemplet: objekt.style.background=\"scroll url(bricks.jpg) repeat-x\"

jes ;·]

Kan du udbygge eksemplet med hvordan man åbner et link ved onclick i en anden frame og hvad hvis jeg vil udvide med andre synsmæssige ting på linket altså tekstfarveændring og rammer omkring link osv. Hvos indsætter jeg disse konfigurationer ?

Du\'r zq da krævende !·]
Kigger lige på det.

Ja jeg ved det men du er skidegod og indtil videre fungerer det jo skidegodt det du har lavet. Du siger bare til når du ikke gider mere

<html>
<head>
<title>Et mouseover farveskift-eksempel</title>

<style><!--
A {color: #ff0000; text-decoration: none;}
A:link {color: #00ffff; text-decoration: underline;}
A:visited {color: #0000ff; text-decoration: underline;}
A:hover    {text-decoration: underline; color: #990000;}
-->
</style>   

<script type =text/javascript>
var aktiv = \'\';
var farve = new Array(\'#112233\',\'#667788\',\'#ddeeff\');
var diver = 4;

function klik(denne){
//    alert(\'document.all.div0 = \' + document.all.div0?true:false );
  for (i=0;i<diver;i++){
    eval(\'document.all.div\'+i+\'.style.backgroundColor=farve[0]\');
  }
  denne.style.backgroundColor=farve[2];
  aktiv = denne.id;
}

function musInd(denne){
  if (denne.id==aktiv)return;
  denne.style.backgroundColor=farve[1];
}

function musUd(denne){
  if (denne.id==aktiv)return;
  denne.style.backgroundColor=farve[0];
}
</script>
</head>

<body>


<div id=div0 style=\'position:absolute;top:10;left:10;width:100;heigth:30;background:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
<a href=\"#\" onClick=\"parent.andetFrameNavn.location.href=\'menu1.html\';\">Menu 1</a>
</div>

<div id=div1 style=\'position:absolute;top:50;left:10;width:100;heigth:30;background:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
<a href=\"#\" onClick=\"parent.andetFrameNavn.location.href=\'menu2.html\';\">Menu 2</a>
</div>

<div id=div2 style=\'position:absolute;top:90;left:10;width:100;heigth:30;background:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
<a href=\"#\" onClick=\"parent.andetFrameNavn.location.href=\'menu3.html\';\">Menu 3</a>
</div>

<div id=div3 style=\'position:absolute;top:130;left:10;width:100;heigth:30;background:#112233\' onMouseOver=\'musInd(this);\' onMouseOut=\'musUd(this);\' onClick=\'klik(this);\'>
<a href=\"#\" onClick=\"parent.andetFrameNavn.location.href=\'menu4.html\';\">Menu 4</a>
</div>

</body>
</html>

hth
jes
Ps. Ikke testet, da jeg ikke lige gad at oprette de der 6 andre filer ;·]

Ja, jeg glemte da lige en detalje:

<style type=text/css><!--