Hi david, thank you for your reply.

The element argument in my previous post was a copy/paste error,
here's a simplified working version of my code:

function init()
{
        var boxes = $('boxes');

        boxes.select('.box').each(
                function (box)
                {
                        Event.observe(box, 'mouseenter', 
mouseEnter.bindAsEventListener
(box, box.down('.tooltip')));
                        Event.observe(box, 'mouseleave', 
mouseLeave.bindAsEventListener
(boxes));
                }
        );

        function mouseEnter(event, tooltip)
        {
                if (!tooltip.visible())
                {
                        tooltip.setStyle({
                                top: (this.positionedOffset().top + 
this.getHeight() + 10) + 'px',
                                left: (this.positionedOffset().left) + 'px'
                        });
                        tooltip.show();
                }
        }

        function mouseLeave(event)
        {
                this.select('.tooltip').invoke('hide');
        }
}

document.observe('dom:loaded', function () { init(); });

On Oct 30, 11:03 am, david <david.brill...@gmail.com> wrote:
> Hi Kupido,
>
> When writting:
> Event.observe(element, 'mouseenter', mouseEnter.bindAsEventListener
> (element));
>
> When writting "bindAsEventListener", it means that your binded
> function will have its scope set to element.
> So your called fiunction should be:
> function mouseEnter(event)
> {
>         this.setStyle('color:blue'); //just an exemple of a call to an
> element method.
>
> }
>
> In your writting, there is an element argument. If you use it, I'm not
> sure it works.
>
> Btw, if you can post your whole code, it could help us.
>
> --
> david
>
> On 30 oct, 10:51, Kupido <kup...@hotmail.com> wrote:
>
> > Hi all,
> > I have a page with some boxes placed side by side. When the user moves
> > over one of them a tooltip appears, then it should disappear when the
> > user moves out or moves over another box.
>
> > I use the mouseenter and mouseleave events to do this but sometimes,
> > when the user moves quickly on the boxes, some tooltips don't hide. I
> > can see even more than one tooltip at the same time and they won't
> > disappear until the boxes are hovered again. It's like the mouseleave
> > event is not triggered, but if I put an alert in it I see it gets
> > triggered.
>
> > The code is the following:
>
> > $('boxes').select('.box').each(
> >         function (element)
> >         {
> >                 Event.observe(element, 'mouseenter', 
> > mouseEnter.bindAsEventListener
> > (element));
> >                 Event.observe(element, 'mouseleave', 
> > mouseLeave.bindAsEventListener
> > (element));
> >         }
> > );
>
> > function mouseEnter(event, element)
> > {
> >         ...
>
> > }
>
> > function mouseLeave(event, element)
> > {
> >         ...
>
> > }
>
> > What am I doing wrong? Any help would be appreciated, thanks in
> > advance.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to