Event canceling...

Discussion in 'Javascript' started by writebrent@gmail.com, May 22, 2006.

  1. Guest

    The goal is the following:

    1) On a mouseover, create & show a div;
    2) If the user hovers over the div, keep it visible, otherwise remove
    and destroy.

    I haven't been able to find examples, so I came up with this idea:

    1) On a mouseover, create & show the div inside a containing div. Set
    this created div as "currently visible";
    2) On mouseover of the containing div, hide the "currently visible"
    div;
    EXCEPT
    3) Cancel the event bubble if the mouse happens to hover over the
    "currently visible" div.

    Of course, what I have so far isn't working, and I don't even know if
    I'm solving the problem in any efficient manner. Any help would be much
    appreciated!

    --Brent
    --------------------------------------------------
    var cv = null; //curr visible

    function ad(e,id) { //create and show div in 1.5 seconds
    var l = e.clientX;
    var t = e.clientY;
    var i = document.getElementById('containerDiv');
    var y = document.createElement('div');
    y.id = 'a'+id;
    y.onmouseover = 'javascript:kv(event)'; //<---this line doesn't seem
    to work!
    y.innerHTML = '<a href="javascript:delLink('+id+')">Delete</a>';
    y.style.height = '100px';
    y.style.width = '100px';
    y.style.border='1px solid #c3c3c3';
    y.style.position='absolute';
    y.style.top = t +'px';
    y.style.left = l +'px';
    e.cancelBubble = true;

    function func()
    {
    i.appendChild(y);
    cv = y;
    }
    window.setTimeout(func, 1500);


    }

    function rd() {//remove div
    var d = document.getElementById('linkdiv');
    function func()
    {
    if(cv != null)
    {
    d.removeChild(cv);
    cv=null;
    }
    //d.removeChild(document.getElementById('man'+id));
    }
    window.setTimeout(func, 1500);
    }

    function kv(e) //keep visible
    {
    e.cancelBubble = true;
    }
    , May 22, 2006
    #1
    1. Advertising

  2. Randy Webb Guest

    said the following on 5/22/2006 1:51 AM:
    > The goal is the following:
    >
    > 1) On a mouseover, create & show a div;
    > 2) If the user hovers over the div, keep it visible, otherwise remove
    > and destroy.


    Why the need to destroy it? If the user mouses over again, you have to
    re-create and destroy it again. Simply hide/show it.

    Or, is this an academic exercise?

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
    Randy Webb, May 22, 2006
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. AT

    Canceling Page.Load event

    AT, Aug 18, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    405
    Rick Strahl [MVP]
    Aug 19, 2005
  2. DazedAndConfused

    Canceling Subsequent events from page_load

    DazedAndConfused, Sep 22, 2005, in forum: ASP .Net
    Replies:
    4
    Views:
    530
    DazedAndConfused
    Sep 23, 2005
  3. Replies:
    0
    Views:
    391
  4. Tony
    Replies:
    7
    Views:
    344
  5. Lubomir
    Replies:
    0
    Views:
    501
    Lubomir
    Feb 5, 2010
Loading...

Share This Page