> I am trying to code an OS X-style menu bar with prototype

Are you talking about the dock?

http://positionabsolute.net/blog/2007/08/prototype-fisheye.php


On Jul 13, 4:05 pm, Mario Colombo <mario.colo...@yetnet.ch> wrote:
> 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
> had.
>
> Please find the example 
> here:http://aldebaran.mine.nu/menu/menu.htmlhttp://aldebaran.mine.nu/menu/menu.jshttp://aldebaran.mine.nu/menu/menu.css
>
> 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:
>
> ---------------[code]----------
> // 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
> ---------------[/code]----------
>
> I also tried to save all effects to the same variable "myEffect",
> trying to have them overwrite themselves, which brought a partial
> improvement.
>
> 2nd problem: On 'mouseout' I would like the menu to return to its
> original state 'width:100px; height:100px;' I tried the following
> code:
>
> ---------------[code]----------
> 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'}});
>         });});
>
> ---------------[/code]----------
>
> This resulted in erratic behaviour.
>
> Help would be greatly appreciated.  Help for better OO programming is
> always welcome. Thank you in advance.
>
> Mario
--~--~---------~--~----~------------~-------~--~----~
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