jquery+css3弹性动感下拉菜单

jquery+css3弹性动感下拉菜单

jquery+css3弹性动感下拉菜单，鼠标滑过可见图片介绍，动态下拉菜单
引用css和js文件
jquery实现代码
$(function() {
	$('#sdt_menu >li').bind('mouseenter',function(){
		
		var $elem = $(this);
		
		$elem.find('img').stop(true).animate({
				'width':'170px',
				'height':'170px',
				'left':'0px'
			 },400,'easeOutBack').andSelf().find('.sdt_wrap').stop(true).animate({'top':'140px'},500,'easeOutBack').andSelf().find('.sdt_active').stop(true).animate({'height':'170px'},300,function(){
				var $sub_menu = $elem.find('.sdt_box');
				if($sub_menu.length){
					var left = '170px';
					if($elem.parent().children().length == $elem.index()+1)
						left = '-170px';
					$sub_menu.show().animate({'left':left},200);
				}	
		});
		
	}).bind('mouseleave',function(){
		var $elem = $(this);
		
		var $sub_menu = $elem.find('.sdt_box');
		
		if($sub_menu.length)
			
			$sub_menu.hide().css('left','0px');
			
			$elem.find('.sdt_active').stop(true).animate({'height':'0px'},300).andSelf().find('img').stop(true).animate({
				'width':'0px',
				'height':'0px',
				'left':'85px'},400).andSelf().find('.sdt_wrap').stop(true).animate({'top':'25px'},500);
	});
	
});