ripristino stato iniziale moveleave su menu a fisarmonica

[-AA-]

partendo da questo esempio:
http://davidwalsh.name/dw-content/kwicks.php

Ho modificato il tutto per averlo in verticale:

	<script type="text/javascript">	
		var Kwicks = new Class({
			Implements: [Options],
			options: {
				squeezeHeight: 60,
				maxHeight: 176
			},
			initialize: function(list,options) {
				this.setOptions(options);
				this.list = document.id(list);
				this.parse();
			},
			parse: function() {
				//vars
				var items = this.list.getElements('a'),
					fx = new Fx.Elements(items, {wait: false, duration: 350, transition:Fx.Transitions.Cubic.easeOut}),
					startHeights = [],
					options = this.options;
				//kwicks items
				items.each(function(item,i) {
					startHeights.push(item.getStyle('height').toInt());
					item.addEvent('mouseenter',function(){
						var fxSettings = {};
						fxSettings[i] = {
							'height': [item.getStyle('height').toInt(),options.maxHeight]
						};
						items.each(function(sibling,ii) {
							if(sibling != item) {
								var h = sibling.getStyle('height').toInt();
								if (h != options.squeezeHeight) {
									fxSettings[ii] = {
										'height': [h,options.squeezeHeight] 
									};
								}
							}
						},this);
						fx.start(fxSettings);
					},this);
				},this);
				//list
				this.list.addEvent('mouseleave',function() {
					var fxSettings = {};
					items.each(function(item,i) {
						
						fxSettings[i] = {
							height: [item.getStyle('height').toInt(), squeezeHeight[i]]
						};
						
						
						
					});
					fx.start(fxSettings);
				});
			}
		});
		
		window.addEvent('domready',function() {
			var kwicks = new Kwicks('kwicks');
		});
		
	</script>

il mio problema è che all'evento mouseleave non viene ripristinato lo stato iniziale .
Ho provato a vedere le l'evento mouseleave viene richiamato mettendo un alert('test') ed effettivamente l'alert appare quando esco con il puntatore...

La parte di codice che dovrebbe far chiudere la "fisarmonica" è questo:

				//list
				this.list.addEvent('mouseleave',function() {
alert('test');
					var fxSettings = {};
					items.each(function(item,i) {
						
						fxSettings[i] = {
							height: [item.getStyle('height').toInt(), squeezeHeight[i]]
						};

dove sbaglio?

[artorius]

che cos'è squeezeHeight?

[-AA-]

up...

[artorius]

ti ho fatto una domanda: Che cos'è la variabile squeezeHeight che chiami nell'evento mouseleave?

[-AA-]

scusa artorius se non ti ho risposto, il motivo era che stavo cercando di capire il come mai non funziona e sono arrivato a capirlo

Il problema è che nella struttura faccio un MiX di jquery e mootools e le due lib. vanno in conflitto (ho letto in giro che il problema è noto e trattato)...

Da quel che ho capito il problema sta nell'utilizzo del simbolo $ tra jquery e mootools.

Ho rifatto il mio "menu a fisarmonica" partendo da questo:
http://davidwalsh.name/dw-content/kwicks.php
(stesso codice ma girato in altezza il movimento invece che in verticale)

Ho poi richiamato la stessa lib. che viene richiamata in quella pagina
http://davidwalsh.name/dw-content/moo1.2.js


Ora...in alcune pagine richiamo anche queste lib.
jquery.colorbox.js
e

	//<![CDATA[
	
		var Site = {
	
			start: function(){
				if($('accordion')) Site.accordion();
			},
			
			accordion: function(){
				var list = $$('#accordion li div.collapse');
				var headings = $$('#accordion li h2');
				var collapsibles = new Array();
				var spans = new Array();
				
				headings.each( function(heading, i) {
 
					var collapsible = new Fx.Slide(list[i], { 
						duration: 500, 
						transition: Fx.Transitions.quadIn
					});
					
					collapsibles[i] = collapsible;
					spans[i] = $E('span', heading);
					
					heading.onclick = function(){
						var span = $E('span', heading);
 
						if(span){
							var newHTML = span.innerHTML == '[img]./images/piu1.gif[/img]' ? '[img]./images/piu2.gif[/img]' : '[img]./images/piu1.gif[/img]';
							span.setHTML(newHTML);
						}
						
						for(var j = 1; j < collapsibles.length; j++){
							if(j!=i) {
								collapsibles[j].slideOut();
								if(spans[j]) spans[j].setHTML('[img]./images/piu1.gif[/img]');
							}
						}
						
						collapsible.toggle();
						return false;
					}
					
					collapsible.hide();
					
				});
			}
		};
		window.addEvent('domready', Site.start);
	//]]>

il tutto mixato va in conflitto e il mio menu a fisarmonica (in alcune pagine appunto) non mi funziona +