Få menu punkt til at blive stående på det valgte menupunkt ligesom apple,com ?

Du retter
#Btn1:hover {
til
#Btn1:hover,.Btn1 {
(for alle 7 stk.)

og så outputter du en class="Btn1" (1-7) via asp på den
knap, som vedrører den side, som brugeren får fremvist.

<ole>

Det er en serveropgave. På serveren sætter du en klasse på det menupunkt, der peger på den aktuelle side. Det kan du ikke løse med CSS.

Ved du i øvrigt godt, at din menu ikke virker i IE6?

/mvh
</bole>

"Det er en serveropgave ... Det kan du ikke løse med CSS."
- Spørgsmålet er oprettet under javascript og ikke css. Det kan godt løses med javascript, men det mest optimale er serverside med en css class der outputtes.

Det kunne for min skyld være oprettet under 'Sovse til lammekød' ... det er stadig en oplagt serveropgave  =)

Prøver jeg lige så ;P

Orh ikke de IE6 buk igen :S heeh

Hva er det af mit kode IE6 ikke forstår ?

IE6 forstår kun :hover på a-elementer  =)

- hvilket vel også er helt okay, når man er ude i at misbruge CSS til funktionalitet - der jo som bekendt bør adresseres med script  ;o)

Du kan lave et adskilt stylesheet der inkluderes til IE under 7 ála:

<!--[if lte IE 7]>
<style type="text/css">
#Btn1 {
expression(this.background=this:hover?"url('./grafik/Btn_Forside.png') no-repeat":"");
}
</style>
<![endif]-->

(Du kan også lave det samme via. script og så inkludere en js fil til IE under 7 på samme måde som ovenstående, men da det jo er browser specifikt målrettet gør det ingen forskel at benytte IE's expression handler - bortset fra at det er nemmere at tilføje evt. IE <7 specifikke css regler hvis behovet melder sig).

Ignorer lige ovenstående (det er vist
et stykke tid siden jeg har leget med
expressions og syntax'en er vist glemt)

- og så er expressions jo ikke noget, MS ligefrem opfordrer os til at bruge ... tværtimod  =)

Umiddelbart ser det ud til at det ville være noget i denne stil

<!--[if lte IE 7]>
<style type="text/css">
#Btn1 {
color: expression(this.onmouseover=function(){this.style.background="url('./grafik/Btn_Forside.png') no-repeat"});
font: expression(this.onmouseout=function(){this.style.background=""});
}
</style>
<![endif]-->

... og øhm, så ville det nok være bedre via. ren javascript :P
(selvfølgelig stadig med conditional comment inkludering af scriptet)

Ole -> Css expression virker ikke i min 64 bit IE 8 release cand. 1. Så det er nok (heldigvis*) noget de udfaser i de nyere browsere.

* Fandt en sikkerhedsmæssig xss hul på et socialt netværkssite for ca. 2 år siden. Hullet gjorde det muligt at snuppe cookies(eller lave andet skidt) netop igennem expression handlerens hul til javascript. Så sikkerhedsmæssigt er det jo også skidt med propertien, da enkelte sites glemmer at parse brugeres css efter om det indeholder "expression".

Kan ikke få det til at virke ?

ser sådan ud. har også prøv med expression(this.background=this:hover?"url('../grafik/Btn_Forside.png') no-repeat":""); uden background

kan man .evt div boxen til at vise en baggrund via JS alla mouseOver ?

<!--[if lte IE 7]>
  <link rel="stylesheet" type="text/css" href="ie-6.0.css" />
<![endif]-->

Styles fra ie-6.0.css --->

#Btn1 {
background: expression(this.background=this:hover?"url('../grafik/Btn_Forside.png') no-repeat":"");
}
#Btn2 {
background: expression(this.background=this:hover?"url('../grafik/Btn_Web.png') no-repeat":"");
}
#Btn3 {
background: expression(this.background=this:hover?"url('../grafik/Btn_DVDCD.png') no-repeat":"");
}
#Btn4 {
background: expression(this.background=this:hover?"url('../grafik/Btn_3D.png') no-repeat":"");
}
#Btn5 {
background: expression(this.background=this:hover?"url('../grafik/Btn_Film.png') no-repeat":"");
}
#Btn6 {
background: expression(this.background=this:hover?"url('../grafik/Btn_Fotograf.png') no-repeat":"");
}
#Btn7 {
background: expression(this.background=this:hover?"url('../grafik/Btn_Cases.png') no-repeat":"");
}

Vedr. problemet med expression: Se #11.
Vedr. javascript løsning istedet kan dette nok bruges

<!--[if lte IE 7]>
<script type="text/javascript">
var elmhov={
  "Btn1":"Btn_Forside",
  "Btn2":"Btn_Web"
};

window.attachEvent("onload", jsie6);
function jsie6(){
  for(i in elmhov){
    var elm=document.getElementById(i);elm.onmouseout=function(){this.style.background="";}
    elm.onmouseover=function(){this.style.background="url('../grafik/"+elmhov[this.id]+".png') no-repeat";}
  }
}

</script>
<![endif]-->

mclemens >> Din expressions syntaks er ukorrekt. Sådan kan du gøre:

<style type="text/css">
#foo {
    background: expression(location.href.indexOf("blabla")>-1?"red":"blue");
}
</style>

<p><a id="foo" href="?side=blabla">LINK</a></p>

- men det er som sagt en _seriøs_ stinker!  :o|

Den var jeg inde og lege med, men da jeg forsøgte at lave en onmouseover og out handler synes jeg at det kiksede lidt (og valgte derfor to properties som expression indgangsvinkel, der nok ikke havde den store betydning i dette tilfælde - d.v.s. endte jeg op med den i #11. Jeg læste godt nok op på syntaksen, men synes ikke at jeg kan gennemskue den nestede funktion med ordentlig return af farve i en background property.

- Og helt enig, det er lugter ikke godt.

Har prøvet at burge koden fra 14# men menuen står stadig stille i IE6 - burger IETester :P.
Har også været inde på diverse sider og brugt js script der skulle kunne ændre BG i divs men uden held.

Så er det nogle af jer der har lavet en dynamisk menu med succe der virker i IE6 :D ?

Tak for jeres svar :P

Nu virker det ;D

Har brugt disse koder:
http://www.javascript-coder.com/button/javascript-button-p1.phtml

Ellers tak for den hurtige hjælp guy's :P

Godt at du fik det til at virker :)

... Hmm, vedr. #14 så virker den i min 64 bit IE 8 release candidate 1 (ved lte 7 rettet til lte 9) samt i min IE 6 service pack 2 ed. uden rettelser. Umiddelbart ville jeg tro at det er conditional comment delen der gør at IETester ikke virker, men hvis det er denne version: 2008-02-25 : v0.1.2 - eller nyere burde det vist virke - hmmm.. Du kan selvfølgelig teste om det er cond. comment delen der gør at IETester ikke virker ved at fjerne start og slut delen og så bruge IETester igen. (Bruger ikke selv IETester, så hvad fejlen er tør jeg ikke sige).

Hej igen :P

Er i fuld gang med at lave min knapper. Men kan ikke ændre navne på mine functions til andet nedestående fuction navne.
skal jo have 3 functioner til hver knap, men kan ikke kalde den fx. changeImageA() istedet for changeImage() og så self ændre det det nede i <a> linket uden den siger der er en fejl i min java. værst med IE6 da der kommer popup fejl.

Burde function ikke kunne hede hvad som helt bare det er lige med det navn jeg kalder efter i mit <a> tag?

function changeImage()
{
  document.images["jsbutton1"].src= upImageA.src;
  return true;
}
function changeImageBack()
{
  document.images["jsbutton1"].src = normalImageA.src;
  return true;
}
function handleMDown()
{
    document.images["jsbutton1"].src = downImageA.src;
    return true;
}
function handleMUp()
{
    changeImage();
    return true;
}

Nu ved jeg ikke om du, i de omdøbne funktionsnavne, kalder funktioner og variabler det samme som her:

<script type="text/javascript">
hmm="noget";
function hmm(){
  alert("Niks");
}
hmm();
</script>

- eller om navne på dine funktioner medfører at IE tror at du vil have fat i elementet istedet for funktionen, såfremt du bruger samme navn.

Såfremt navngivningen giver problemer, så anbefaler jeg at du benytter et andet navn. Såfremt det ikke hjælper og der ikke er navne sammenfald som måske ellers kan være årsagen til problemet og alle variabler og funktionsnavne henvisninger er korrekte, så må du nok vise kildekoden så problemet kan findes.

Umiddelbart kan jeg heller ikke se at du skal bruge 3 funktioner til hver knap, heller ikke at du skal definere handlers på alle elementerne, viderestilling via. javascript href istedet for almindelig a href undrer mig også en smule ... men nok om de ting, jeg ville nok vælge, (næstefter det at bruge a elementer som billede links med :hover funktionalitet understøttet), at benytte et javascript der aktiverede handlers til billederne og satte billedekilderne ... ála (tilrettet #14):

<script type="text/javascript">
var elmhov={
  "Btn1":"Btn_Forside",
  "Btn2":"Btn_Web"
};

if(window.addEventListener)window.addEventListener("load", initit, false);
else if(window.attachEvent)window.attachEvent("onload", initit);
function initit(){
  for(i in elmhov){
    var elm=document.getElementById(i);elm.onmouseout=function(){this.style.background="";}
    elm.onmouseover=function(){this.style.background="url('./grafik/"+elmhov[this.id]+".png') no-repeat";}
  }
}

</script>

... men som sagt, min undren beror nok mest i at jeg ikke lige kan gennemskue hvad du ønsker at javascriptet skal gøre - ovenstående burde du dog let kunne udvide til resten af knapperne med definering af href forward, såfremt dette foretrækkes.

M.h.t. a:hover menu, kunne en knap se sådan ud:

<style type="text/css">
#menu{background:url('./grafik/Buttons.png');height:34px;width:699px;}
#menu a {display:block;float:left;height:34px;}
a#forside {width:100px;}
a#forside:hover {background:url('./grafik/Btn_Forside.png');}
</style>
             
<div id="menu"><a href="noget.html" id="forside">&nbsp;</a></div>

Mange tak for svaret Mclemens ;D

Har lavet det som nedestående, hvor det virker perfekt i IE6 og 7, men så i FF kommer et 18px mellem rum fra toppen af knappen så man kun kan se 14px af baggrundsbillede som jeg bare ikke kan fixe ?

Link: http://lundoconsulting.dk.web15.123test.dk/dmmd.aspx

<div style="width:699px; height:32px; display:block; background: url('Grafik/Buttons.png') no-repeat ; " >
                  <div id="Btn1" style="width:99px; height:32px; position: relative; float: left;  "  >
    <a href="dmmd.aspx?act=Forside&name=Forside" id="Forside" ><img
src="grafik/Btn_shadow.gif" width="99px" height="32px" border="0"
alt="" /></a>
                  </div>
                  <div id="Btn2" style="width:100px; height:32px; position: relative; float: left; display:block;  " >
    <a href="dmmd.aspx?act=Web&name=Web" id="Web" ><img
src="grafik/Btn_shadow.gif" width="100px" height="32px" border="0"
alt="" /></a>
                  </div>
                  <div id="Btn3" style="width:100px; height:32px; position: relative; float: left; "  >
    <a href="dmmd.aspx?act=CD/DVD&name=CD/DVD" id="CDDVD" ><img
src="grafik/Btn_shadow.gif" width="100px" height="32px" border="0"
alt="" /></a>
                  </div>
                  <div id="Btn4" style="width:100px; height:32px; position: relative; float: left; "  >
    <a href="dmmd.aspx?act=3D&name=3D" id="Grafiks" ><img
src="grafik/Btn_shadow.gif" width="100px" height="32px" border="0"
alt="" /></a>
                  </div>
                  <div id="Btn5" style="width:100px; height:32px; position: relative; float: left; "  >
    <a href="dmmd.aspx?act=Film&name=Film" id="Film" ><img
src="grafik/Btn_shadow.gif" width="100px" height="32px" border="0"
alt="" /></a>
                  </div>
                  <div id="Btn6" style="width:100px; height:32px; position: relative; float: left; " >
    <a href="dmmd.aspx?act=Fotograf&name=Fotograf" id="Fotograf" ><img
src="grafik/Btn_shadow.gif" width="100px" height="32px" border="0"
alt="" /></a>
                  </div>
                  <div id="Btn7" style="width:100px; height:32px; position: relative; float: left; "  >
    <a href="dmmd.aspx?act=Cases&name=Cases" id="Cases" ><img
src="grafik/Btn_shadow.gif" width="100px" height="32px" border="0"
alt="" /></a>
                  </div>
            </div>

a#Forside:hover {background:url('../grafik/Btn_ForsideU.png') no-repeat; height: 32px;  }
a#Web:hover {background:url('../grafik/Btn_WebU.png') no-repeat; height: 32px; }
a#CDDVD:hover {background:url('../grafik/Btn_DVDCDU.png') no-repeat; height: 32px; }
a#Grafiks:hover {background:url('../grafik/Btn_3DU.png') no-repeat; height: 32px; }
a#Film:hover {background:url('../grafik/Btn_FILMU.png') no-repeat; height: 32px; }
a#Fotograf:hover {background:url('../grafik/Btn_fotografU.png') no-repeat; height: 32px; }
a#Cases:hover {background:url('../grafik/Btn_CasesU.png') no-repeat; height: 32px; }

tak :)

Du har fjernet display:block fra dine knap elementer. Tilføj det
til dine knappers css regler, så virker det (i min FF 3.0.6).

- Du min kodenings gud mclemens :D

Mange tak for din store hjælp.

Velbekomme og tak for point :)