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 -~----------~----~----~----~------~----~------~--~---