Avatar billede Slettet bruger
09. januar 2005 - 16:01 Der er 12 kommentarer og
1 løsning

IE problemer.

Jeg har lavet en lille smule CSS som skulle få menupunkter til at rykke sig 1 pixel nedad og lave tekstens farve #666 når musen er over.

Menupunkter består af et lille ikon og en tekst:
<span class="menu_punkt"><img src="images/menu_punkt.png" alt="">Menu punkt nr. 1</span>


og stylesheetet ser sådan ud:
span.menu_punkt {
    font-family: arial, sans-sherif;
    font-weight:600;
    font-size: 12px;
    color:#444;
    position:relative;
    top:-1px;
}
span.menu_punkt:hover {
    cursor:pointer;
    color:#666;
    top:0px;
}
span.menu_punkt img {
    position:relative;
    top:2px;
    left:-4px;
}


Er overstående ikke ganske alnindelig valid css? Det virker fuldt efter hensigten i Firefox, men ikke i IE. (ggrrrhh!)

Håber en vil hjælpe :)

Mvh. GartZen
Avatar billede morteeart Nybegynder
09. januar 2005 - 16:06 #1
ja, fordi at stakkels Internet Explorer ikke forstår at hover effekten også må være på andre elementer end <a href=""></a> (href="" skal endda med !)

Du kan løse problemet med javascript.
Avatar billede mm12010 Nybegynder
09. januar 2005 - 16:18 #2
kan og skal sikkert lægges ud i en funktion:

<span class="menu_punkt" onmouseover="this.style.cursor='pointer';this.style.color='#666';this.style.top='0px';" onmouseout="this.style.cursor='default';this.style.color='#444';this.style.top='-1px';"><img src="images/menu_punkt.png" alt="">Menu punkt nr. 1</span>
Avatar billede morteeart Nybegynder
09. januar 2005 - 16:18 #3
eksempel:

<script type="text/javscript">
function move(menu,inout)
{
  styleObj = menu.style;
  if(inout == 1)
  {
    styleObj.color = "#666"; // textfarve
    styleObj.marginTop = "1px"; // margin
  }
  else
  {
    styleObj.color = "#444"; // textfarve
    styleObj.marginTop = "0px"; // margin
  }
}
</script>


bruges så ved

<span onmouseover="move(this,1)" onmouseout="move(this,0)">
blabla
</span>
Avatar billede Slettet bruger
09. januar 2005 - 16:19 #4
nå.. øv.. Tak for hjælpen anyway :) Point?
Avatar billede roenving Novice
09. januar 2005 - 16:20 #5
-- det er iøvrigt noget vrøvl at ændre cursor ved hover, da den i forvejen kun virker ved hover ...
Avatar billede Slettet bruger
09. januar 2005 - 16:21 #6
Det kan jeg vel blive nød til så.. :) (L***E SP****R IE!) ;o)
Avatar billede morteeart Nybegynder
09. januar 2005 - 16:21 #7
nej tak, samler ikke på point.
Avatar billede Slettet bruger
09. januar 2005 - 16:22 #8
roenving -> Hvad mener du? Man skal da have lov til at ændre cursoren hvis man vil..
Avatar billede Slettet bruger
09. januar 2005 - 16:22 #9
ok :)
Avatar billede roenving Novice
09. januar 2005 - 16:26 #10
Hvis du sætter en cursor for et element, vil den naturligvis kun virke, hvis cursoren er ovenover elementet (svarer til: 'Hvis du kan læse dette, er din skærm tændt' !-)
Avatar billede morteeart Nybegynder
09. januar 2005 - 16:29 #11
roenving, det er jo nødvendigt at ændre cursor ved hover elementer som ikke er <a> , for at stakkels IE kan finde ud af at ændre den til pointer cursoren, istedet for den default.
Avatar billede Slettet bruger
09. januar 2005 - 16:29 #12
Arh det var det du mente.. Jeg det er selvfølgelig rigtigt. Men det andet er jo faktisk mere meningsgivende.. Men det er jo individuelt.
Avatar billede roenving Novice
09. januar 2005 - 16:32 #13
>>morteeart

Så sætter du bare cursoren på elementet:

<div style="cursor:pointer">Her er en pointer-cursor</div>

og

<div onmouseover="this.style.cursor='pointer';">Her er en pointer-cursor</div>

virker fuldstændig ens (i alle browsere, hvis javascript er slået til !-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester