Dale Russell: onMouseover/-out wird zu oft aufgerufen

SELF-Forum

onMouseover/-out wird zu oft aufgerufen

Dale Russell
– Informationen zu den Bewertungsregeln

Wie unter dem Thema "Elemente weich ein-/ausblenden" erläutert wollte ich ein Menü weich einblenden.
Jetzt habe ich einen Code geschrieben der das auch recht ansprechend macht. Aber mir scheinen die Event-Handler etwas zu oft aufgerufen zu werden.

Denn der span-Teil wird nicht nur bei Betreten und Verlassen des umschließenden divs (also alles mit grauem Hintergrund) ein-/ausgefadet, sondern auch wenn vom p-Bereich auf den Span-Bereich gewechselt wird. Und auch beim Wechsel zu und von den Links.

Unten hänge ich mal einen minimalisierten Testcase an. Vielleicht kann mir jemand auf die Sprünge helfen, wo mein Denkfehler steckt.

Dale

---

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>einblend-Test</title>

<style type="text/css">
#switch {position:absolute; background-color:lightgrey;}
div#switch span {display:none;}
/* div#switch:hover span {display:block;}*/
</style>

<script type="text/javascript">
var curop = 0.1;

function showswitch()
{
blendin();

var el = document.getElementById("switch").getElementsByTagName("span")[0];
el.style.display = "block";
}

function blendin()
{
var el = document.getElementById("switch");

if (curop < 1)
{
  curop += 0.1;
  el.style.opacity = curop;
  window.setTimeout("blendin()", 100);
}

}

function hideswitch()
{
var el = document.getElementById("switch").getElementsByTagName("span")[0];

el.style.display = "none";
curop = 0.1;
}

</script>
</head>

<body>
<div id="switch" onMouseover="showswitch();" onMouseout="hideswitch();">
<p>Text</p>
<span>
Style: <a href="link1.html">Link 1</a> &#124; <a href="link1.html">Link 2</a> &#124; <a href="link1.html">Link 3</a>
</span>
</div>
</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. onMouseover/-out wird zu oft aufgerufen

    XaraX Homepage des Autors
    – Informationen zu den Bewertungsregeln

    Hallo Dale,

    onMouseover="alert('huhu')" ist eine wirklich elegante Methode den User zu ärgern, da bei manchen Browser(versionen) bei jeder Bewegung des Cursors der Event eintritt. Also muß beim ersten Eintreten des Events die ausgeführte Funktion gelöscht werden:

      
<p onMouseover="alert('huhu');this.onmouseover=''"  
   onMouseout="this.onmouseover=function(){alert('huhu');}">

    Gruß aus Berlin!
    eddi

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. onMouseover/-out wird zu oft aufgerufen

      Gernot Back Homepage des Autors
      – Informationen zu den Bewertungsregeln

      Hallo Eddi, hallo Dale,

      onMouseover="alert('huhu')" ist eine wirklich elegante Methode den User zu ärgern, da bei manchen Browser(versionen) bei jeder Bewegung des Cursors der Event eintritt. Also muß beim ersten Eintreten des Events die ausgeführte Funktion gelöscht werden:

        

> <p onMouseover="alert('huhu');this.onmouseover=''"  
>    onMouseout="this.onmouseover=function(){alert('huhu');}">

      Ich glaube, im Falle verschachtelter Elemente hilft das nicht.

      Es geht doch wahrscheinlich um das folgende Problem:

      http://forum.de.selfhtml.org/archiv/2005/4/t105365/

      Gruß Gernot

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln