fejl på rollover

Ser ingen streg og bruger IE6.0

heller ikke her bruger osse IE 6.0, hvilken browser bruger du ??

Synes nu jeg var grundig inden jeg kommenterede første gang men kan da godt se musen skifter fra hånd til pil og derefter til hånd igen inden man forlader menuen/knappen så jeg smutter forhåbentlig ubemærket igen :-)

Der er ingen streg, men du har elementer indeni, som først skal opdage, at de skal sende mouseoveren videre, og mouseouten er derfor allerede eksekveret på td'en ...

Prøv engang med:

<td width="40" onMouseOver="this.style.background='url(../grafik/design/rollin.gif)';" onMouseOut="this.style.background='url(../grafik/design/rollout.gif)';" onClick="location.href='/';" style="cursor:hand;cursor:pointer;font-weight:bold;font-size:small">&nbsp;Generelt&nbsp;</td>

-- bemærk, at jeg også har givet andre browsere end forældede M$-browsere en relevant cursor !-)

Hwaa, nu du er så godt i gang, hvad så med at gøre det logiske: at bruge et <a> element til både at sørge for den lille hånd OG for linkningen istedet for at gøre det pr script... "onclick="location.href='blabla'"" må være en af de mest sikre måder at gøre en side utilgængelig på!!

<td width="40" onMouseOver="this.style.background='url(../grafik/design/rollin.gif)';" onMouseOut="this.style.background='url(../grafik/design/rollout.gif)';" style="font-weight:bold;font-size:small"><a href="/" style="display:block">&nbsp;Generelt&nbsp;</a></td>

"style="display:block"" skulle gerne få <a>'et til at udfylde hele <td>'en i bredden... korreksér mig om jeg tager fejl... :~)

>>knudx

Det der med bredden burde være helt korrekt, men hvad med højden ?-)

-- og problemet med at et element inde i sørger for en mouseout ?o]

Så <a> (eller <font> og <strong> som det er nu) sku generere et mouseover/out, som så bliver opfanget af <td>?

Det er jo hamrende ulogisk!! Mouseover på <td>'en burde jo betyde at man kun er interesseret i EN event.
Forslag: onMouseOver="if ((event.target||event.srcElement)==this) this.style.background='url(../grafik/design/rollin.gif)';"

Kan godt være at du synes det er ulogisk, men når nu alle de browsere jeg kender, reagerer som om det er logikken, som sker må man jo reagere på det ...

-- og hvis man kan få et element inde i til at udfylde helt, vil problemet jo ikke opstå, da mouseoveren så først vil komme ved at den bobler op til td'en ...

Som jeg fortolker fænomenet handler det om, at alle elementer har deres selvstændige sæt events, så et element inde i et andet kan tillade sig at få en event (f.eks. mouseover !-) uden at det omgivende element nødvendigvis reagerer ...

-- en sideeffekt til dette er selvfølgelig at det omgivende element så nødvendigvis må få en mouseover, da det jo nu er elementet inde i, som har en mouseover.

Når browseren så opdager, at elementerne inde i ikke har en handling i mouseover bobler den eventen videre til det omkransende element, hvorefter der igen er en mouseover på td'en ...

-- og det skal tilføjes, at der faktisk i nogle Netscape-versioner var den omvendte model, så en eventuel hændelse dryppede ned igennem objekt-hierarkiet ...

... at det omgivende element så nødvendigvis må få en mouseout, da ...

har nu prøvet roenvings forslag på "generelt" knappen og knudx på "hosting", men synes ik rigtig der er nogen af dem, endnu, der får mig til at bryde ud i glædes-jubleri..

desværre..
men keep on truckin' guys..

joe øøh - ved nærmere test er jeg nået frem til at Rønvig har ret - der er ingen måde at undgå den 'nedarvede' event: Mouseover/out på <font> sendes videre til over/out på <td>.
Selvom testen i mit eksempel sorterer nogle af dem fra, genereres der en mouseover når cursoren bevæger sig ud fra det indre element ind i det omgivende (fra <font> til <td>).
Skal man undgå det skal man ud i endu mere testning, og det bliver noget hacker pis.

En anden mulighed ville være at bruge et <a> element til events, og derfra adressere den omgivende <td> med [this.parentNode]:

<td width="40"
  style="cursor:hand;">
  <a
    onMouseOver="this.parentNode.style.background='url(../grafik/design/rollin.gif)';"
    onMouseOut="this.parentNode.style.background='url(../grafik/design/rollout.gif)';"
    href='/hosting/'><strong><font size="2">
    &nbsp;Hosting&nbsp;
  </font></strong></a>
</td>

Vær opmærksom på at hvis du har flere elementer indeni hindanden kan det være nødvendigt mad flere parentNode, fx
<td width="40" >
  <a href='/hosting/'>
    <strong
      onMouseOver="this.parentNode.parentNode.style.background =
      'url(../grafik/design/rollin.gif)';">
      <font size="2">
        &nbsp;Hosting&nbsp;
      </font>
    </strong>
  </a>
</td>

...godmorgen !-)

jamen problemet er jo at det gerne skulle være med onMouseOver på hele feltet.. så det netop ik kun er selve teksten det virker på, men på hele TD feltet.

derfor vil jeg ikke mene at det kan betale sig at lave det på <a>tagget..

har nu testet ovenstående fra knudx.. det kan ses på "hosting" knappen..

Synes ikke det holder helt.. :-S

virker som om dette er en svær nød at knække.. så smider da lige nogle flere point på når den er løst

Hvilken form for fejl får du på min metode ?-)

f.eks.

<table>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td width="40" onMouseOver="this.style.backgroundImage='url(http://devino.dk/grafik/design/rollin.gif)';" onMouseOut="this.style.backgroundImage='url(http://devino.dk/grafik/design/rollout.gif)';" onClick="location.href='/';" style="background:url(http://devino.dk/grafik/design/rollout.gif) #876;cursor:hand;cursor:pointer;font-weight:bold;font-size:small">&nbsp;Generelt&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>

virker da fint, men man kan jo ikke undgå det blink, når browseren lige skal checke, om der er ændret i billedet ...

hvad hvis man preloader billedet ?.. kan man så fjerne blinket.. ?

eller ville det måske være nemmere at lave det med en transperant farve-fade ?

og hvordan få jeg lige teksten længere ned i størrelse end "small".. skal jo være size 2

x-small er size=2 ...

-- og blinket kan ikke helt fjernes, hvis brugeren har slået sin Kontroller nye versioner hver gang siden besøges til !-)

Hmm.. skummelt at den har indflydelse på noget da det jo ik er et nyt side besøg.. i princippet..

nå.. roenving.. læg et svar..

det ser sgu fornuftigt ud når man slår den der fra..

tror det er det bedste jeg kan opnå..

Velbekomme '-)

-- og jeg er enig i, at det er skummelt med det blink ...

-- du kan gøre blinket en anelse mindre ved store billeder ved at preloade, men små billeder kan man ikke forbedre, da IE åbenbart opfatter det som 'et nyt besøg', når et billede udskiftes, og den derfor undersøger om en ny udgave findes på serveren ...

hmm.. fik da ik lige afsat flere point.. sig lige til hvis du ønsker flere

-- tak for point ;~}