Einfacher Toggle Effekt

Carrear

Erfahrenes Mitglied
Hi Leute,

ich habe eine Toggle Effekt für ein Menü:


Code:
        $(".navigation>li").bind("mouseenter mouseleave", function(){
            $(this).children('ul').stop(1,1).slideToggle('fast');
            var elementUl = $(this).children('ul');
            var positionUl = elementUl.offset();
            var elementHead = $("#impression");
            var positionHead = elementHead.offset();
            if((positionHead.left + 860) < (positionUl.left + 400)){
                $(this).children('ul').css('left','auto');
                $(this).children('ul').css('right','0');
            }
        });

Ich möchte jetzt allerdings, dass es nur beim mouseenter "togglet". Beim mouseleave soll die Untergeordnete Liste einfach verschwinden. Also ich würde es dann tendentiell auf zwei Funktionen aufteilen und anstatt mit bind eben mit mouseenter und mouseleave arbeiten. aber ich weiß nicht was ich dann jeweils hinter $(this).children('ul') (also zweile 2) machen soll.
 
Sollte jemand Interesse haben: Ich habe es jetzt so gelöst -

Code:
		$(".navigation>li").mouseenter(function(){
			$(this).children('ul').fadeIn('fast');
			var elementUl = $(this).children('ul');
			var positionUl = elementUl.offset();
			var elementHead = $("#impression");
			var positionHead = elementHead.offset();
			if((positionHead.left + 860) < (positionUl.left + 400)){
				$(this).children('ul').css('left','auto');
				$(this).children('ul').css('right','0');
			}
		});    

		$(".navigation>li").mouseleave(function(){
			$(this).children('ul').hide();
			var elementUl = $(this).children('ul');
			var positionUl = elementUl.offset();
			var elementHead = $("#impression");
			var positionHead = elementHead.offset();
			if((positionHead.left + 860) < (positionUl.left + 400)){
				$(this).children('ul').css('left','auto');
				$(this).children('ul').css('right','0');
			}
		});
 
Zurück