Hi everybody,

I am trying to code an OS X-style menu bar with prototype and
scriptaculous 1.8.2. I have two problems which I hope to solve with
your feedback. I myself am stuck after failing with all the ideas I

Please find the example here:

1st problem: image flickering: changing mouseover over the different
divs produces a "flash" or flickering. Reading this group and other
sources suggest that it is a problem with different Effects active at
the same time. I tried to solve this over Effect.Queues and cancel the
whole queue with my scope: 'menu' but unfortunately cancelling queues
results in no effects at all:

// menuelement is the current menu div from  $$('.level_one').each
(function(menuelement) {

elDimensions = menuelement.getDimensions(); // to set style manually
to where the effect was cancelled
var queue = Effect.Queues.get('menu'); // cancelling the whole scope:
'menu' queue
queue.each(function(effect) { effect.cancel(); });

menuelement.setStyle('height:'+ elDimensions.height + 'px; ' +
'width:' + elDimensions.width + 'px;')   // set dimensions to where
effect stops
var myEffect = new Effect.Morph(menuelement, {style: {width:'100px',
height:'100px'}, queue: {position: 'end', scope: 'menu'}}); //new
effect takes place

I also tried to save all effects to the same variable "myEffect",
trying to have them overwrite themselves, which brought a partial

2nd problem: On 'mouseout' I would like the menu to return to its
original state 'width:100px; height:100px;' I tried the following

Event.observe($('menu'), 'mouseout', function(event) {          //
'menu' is the id of the containing div
        $$('.level_one').each(function(menuelement) {
        var myEffect = new Effect.Morph(menuelement, {style:
{width:'100px', height:'100px'}});

This resulted in erratic behaviour.

Help would be greatly appreciated.  Help for better OO programming is
always welcome. Thank you 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 
For more options, visit this group at 

Reply via email to