After some testing I noticed the problem only occurs when I use: tooltip.appear(); // scriptaculous effect
insted of: tooltip.show(); Any suggestions? On Oct 30, 11:37 am, Kupido <kup...@hotmail.com> wrote: > 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 -~----------~----~----~----~------~----~------~--~---