JS event : onmouseover problem

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|

JS event : onmouseover problem

Tiana RAZAFINDRALAMBO

Hi list,
I've some problem with a js event >> myHtmlDom.onmouseover = myFunc;

below the code :

HTML part :

      <ul id="menu" class="menu">
            <li><a href="#">Item</a></li>
            <li><a href="#">Item</a></li>
            <li><a href="#">Item</a></li>
            <li><a href="#">Item</a></li>
            <li id="scroll" class="scroll"></li>
        </ul>

haXe part :

var menu = Lib.document.getElementsById("menu");
var li = menu.getElementsByTagName('li');
var target = li[0];

var doSomething = function(e)    { 
                                            target = (e!=null)?e.target:li[0];                                            
                                            trace(target.nodeName);   
                                        };

var x = 0;
var y= l.length;

while(x<y)
                {
                    if(li[x].getAttribute('id')!="scroll")
                    {
                        li[x].onmouseover = doSomething; 
                    }
                    x++;
                }        


In your opinion, doSomething will be called only if the mouse is over a LI element?
If yes, why the trace(target.nodeName) displays me A elements :s... ?

trace displays :
Main.hx:79: LI
Main.hx:79: LI
Main.hx:79: A
Main.hx:79: LI
Main.hx:79: LI
Main.hx:79: A
Main.hx:79: A
Main.hx:79: LI


cordially.
--
RAZAFINDRALAMBO Tiana



--
haXe - an open source web programming language
http://haxe.org
Reply | Threaded
Open this post in threaded view
|

Re: JS event : onmouseover problem

clemos
Hi Tiana

This is more a Javascript question, I guess...
Yet, I think it's the expected behaviour; as said here :
http://www.quirksmode.org/js/events_properties.html
"Even if an event is captured or bubbles up, the target/srcElement
always remains the element the event took place on."
When your mouse is on your <a> which is in your <li> then event.target
is the <a>

What you're looking for is event.currentTarget.

Hope it helps,
Clément

On Tue, Aug 17, 2010 at 3:42 PM, Tiana RAZAFINDRALAMBO
<[hidden email]> wrote:

>
> Hi list,
> I've some problem with a js event >> myHtmlDom.onmouseover = myFunc;
>
> below the code :
>
> HTML part :
>
>       <ul id="menu" class="menu">
>             <li><a href="#">Item</a></li>
>             <li><a href="#">Item</a></li>
>             <li><a href="#">Item</a></li>
>             <li><a href="#">Item</a></li>
>             <li id="scroll" class="scroll"></li>
>         </ul>
>
> haXe part :
>
> var menu = Lib.document.getElementsById("menu");
> var li = menu.getElementsByTagName('li');
> var target = li[0];
>
> var doSomething = function(e)    {
>                                             target =
> (e!=null)?e.target:li[0];
>                                             trace(target.nodeName);
>                                         };
>
> var x = 0;
> var y= l.length;
>
> while(x<y)
>                 {
>                     if(li[x].getAttribute('id')!="scroll")
>                     {
>                         li[x].onmouseover = doSomething;
>                     }
>                     x++;
>                 }
>
>
> In your opinion, doSomething will be called only if the mouse is over a LI
> element?
> If yes, why the trace(target.nodeName) displays me A elements :s... ?
>
> trace displays :
> Main.hx:79: LI
> Main.hx:79: LI
> Main.hx:79: A
> Main.hx:79: LI
> Main.hx:79: LI
> Main.hx:79: A
> Main.hx:79: A
> Main.hx:79: LI
>
>
> cordially.
> --
> RAZAFINDRALAMBO Tiana
>
>
>
> --
> haXe - an open source web programming language
> http://haxe.org
>

--
haXe - an open source web programming language
http://haxe.org
Reply | Threaded
Open this post in threaded view
|

RE: JS event : onmouseover problem

Tiana RAZAFINDRALAMBO
In reply to this post by Tiana RAZAFINDRALAMBO
Ok , i understand.

thanks Clément

cordially
--
RAZAFINDRALAMBO Tiana



--
haXe - an open source web programming language
http://haxe.org