Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts

    DropDown menu onmouseout problem

    Hey,
    I'm still having a bit of a problem with my dropdown menu.

    Whenever I hover my mouse on the element, the menu opens but it closes immediately unless when I hover the mouse on the element, it was just the background (not the text of the menu element).
    So I've tried using the contains function and try and see if the mouse location is within the menu element but still have the same problem.

    Here's the JS code [Just the events]:
    Code:
    obj.onmouseover = (function(e)
        {
            return function()
            {
                openmenu(opts);
                return false;
            }
        })(opts);
        obj.onmouseout = (function(opts,e)
        {
            var oThis = this;
            return function(e)
            {
                e = typeof(e)=='undefined'?window.event:e;
                if(document.all&&(!opts.contains(e.toElement)&&!oThis.contains(e.toElement)))
                    tmr = window.setTimeout(function(){closemenu(opts);},delay);
                else if(!contains(opts, e.relatedTarget)&&!contains(oThis,e.relatedTarget))
                    tmr = window.setTimeout(function(){closemenu(opts);},delay);
                return false;
            }
        })(opts);
        opts.onmouseover = function(e)
        {
            window.clearTimeout(tmr);
            tmr = null;
        }
        opts.onmouseout = (function(obj)
        {
            var oThis = this;
            return function(e)
            {
                e = typeof(e)=='undefined'?window.event:e;
                if(document.all&&!this.contains(e.toElement))
                    tmr = window.setTimeout(function(){closemenu(oThis);},delay);
                else if(!contains(this, e.relatedTarget))
                {
                    e.stopPropagation();
                    tmr = window.setTimeout(function(){closemenu(oThis);},delay);
                }
            }
        })(obj);
    You can see how it works over here:
    www.imri-tech.net/splusw/index.asp
    Last edited by BarrMan; 09-01-2008 at 11:00 AM.

  • #2
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    Forgot to mention.
    I'm using Firefox.

  • #3
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    Solved.

    I added also height:100% to the anchors of the menu so it won't switch elements all the time.
    Then I changed the opts.onmouseout code to:
    Code:
    opts.onmouseout = function()
        {
            var oThis = this;
            tmr = window.setTimeout(function()
            {
                closemenu(oThis);
            },delay);
        };


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •