Op deze website gebruiken we cookies om content en advertenties te personaliseren, om functies voor social media te bieden en om ons websiteverkeer te analyseren. Ook delen we informatie over uw gebruik van onze site met onze partners voor social media, adverteren en analyse. Deze partners kunnen deze gegevens combineren met andere informatie die u aan ze heeft verstrekt of die ze hebben verzameld op basis van uw gebruik van hun services. Meer informatie.

Akkoord

Vraag & Antwoord

Webprogrammeren & scripting

Onmouseover events maken div knipperend

JanDeGroot
4 antwoorden
  • In mijn bron staat de volgende code:

    [code:1:aea3523da3]<div class="menuiteminactief" id="contactout" onmouseover="HideDIV('contactout');DisplayDIV('contact')"><a href="contact.html" class="menu1">Contact</a></div>
    <div class="menuitemactief" id="contact" style="display:none;" onmouseout="HideDIV('contact');DisplayDIV('contactout')">
    <a href="contact.html" class="menu1" onmouseover="changeBg('contact','2')" onmouseout="changeBg('contact','1')">Contact</a><br>
    <a href="contact.html" class="menu2" onmouseover="changeBg('contact','3')" onmouseout="changeBg('contact','1')">Verslagen</a><br>
    <a href="contact.html" class="menu2" onmouseover="changeBg('contact','4')" onmouseout="changeBg('contact','1')">Lid worden</a><br>
    <a href="contact.html" class="menu2" onmouseover="changeBg('contact','5')" onmouseout="changeBg('contact','1')">Andere vraag</a>
    </div>[/code:1:aea3523da3]

    Probleem is echter dat de hele div (id contact) knippert zodra je op een van de vier linkjes komt, of er juist vanaf gaat.

    Dit is de bijbehorende javascript code.

    [code:1:aea3523da3]<script language="javascript" type="text/javascript"><!–
    var ns = (document.all)?false:true;
    var intBack = 1;

    //function for dynamically switching the background image
    function changeBg(divId,intBack) {
    if (ns){
    layerObject = document.getElementById(divId).style;
    } else {
    layerObject = eval(divId + ".style");
    }
    layerObject.backgroundImage = 'url(images/menuactief'+intBack+'.png)';
    }
    // –></script>

    <script type="text/javascript" language="JavaScript"><!–
    function HideDIV(d) { document.getElementById(d).style.display = "none"; }
    function DisplayDIV(d) { document.getElementById(d).style.display = "block"; }
    //–></script>[/code:1:aea3523da3]

    Heeft iemand een idee hoe dit op te lossen is? Voor een volledig voorbeeld:
    http://www.zuidamerika.net/ftcw2008/index_menutest.html
  • Simpel toch: verplaats het onmousover event naar iedere div apart. Even het betere Ctrl+X/Ctrl+V werk zogezegd. ;)
  • Sorry Ger, ik vrees dat ik je niet helemaal kan volgen. Als ik de mouseoer knip/plak naar de div "contact", dan werkt het mouseover event niet. Kopieer ik de mouseover code naar de andere div, dan werkt het wel. Maar dan knippert ie weer….

    Ik heb dan dit gedaan.
    [code:1:6256f5ceaa]<div class="menuiteminactief" id="contactout" onmouseover="HideDIV('contactout');DisplayDIV('contact')"><a href="contact.html" class="menu1">Contact</a></div>
    <div class="menuitemactief" id="contact" style="display:none;" onmouseout="HideDIV('contact');DisplayDIV('contactout')" onmouseover="HideDIV('contactout');DisplayDIV('contact')">
    <a href="contact.html" class="menu1" onmouseover="changeBg('contact','2')" onmouseout="changeBg('contact','1')">Contact</a><br>
    <a href="contact.html" class="menu2" onmouseover="changeBg('contact','3')" onmouseout="changeBg('contact','1')">Verslagen</a><br>
    <a href="contact.html" class="menu2" onmouseover="changeBg('contact','4')" onmouseout="changeBg('contact','1')">Lid worden</a><br>
    <a href="contact.html" class="menu2" onmouseover="changeBg('contact','5')" onmouseout="changeBg('contact','1')">Andere vraag</a>
    </div>[/code:1:6256f5ceaa]

    Hij knippert bij iedere overgang van de div naar de a en vice versa. (lokaal overigens niet altijd, maar eenmaal achter de site wel)
  • Waarom doe je zo moeilijk met javaScript? Waarom gebruik je niet gewoon CSS?

Beantwoord deze vraag

Dit is een gearchiveerde pagina. Antwoorden is niet meer mogelijk.