jQuery+css3鼠标悬停图片文字动画出现特效

jQuery+css3鼠标悬停图片文字动画出现特效，这是一款仿芒果旅游网悬浮框动画效果网页图文切换展示代码。

分类：图片代码 > 鼠标滑过难易：初级

查看演示下载资源下载积分： 20 积分

js代码

<script src="jquery/jquery-1.7.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		$('li').mouseenter(function(){
			$(this).find('.divA').stop().animate({bottom:'-66px'});
			$(this).find('.a2').css({left:'0'})
			$(this).children('.a2').find('.p4').css({left:'0'})
			$(this).children('.a2').find('.p5').css({left:'0'})
			$(this).children('.a2').find('.p6').css({transform:'scale(1)'})
			$(this).children('.a2').find('.p7').css({bottom:'25px'})
		})
		$('li').mouseleave(function(){
			$(this).find('.divA').stop().animate({bottom:'0px'});
			$(this).find('.a2').css({left:-$(this).width()})
			$(this).children('.a2').find('.p4').css({left:-$(this).width()})
			$(this).children('.a2').find('.p5').css({left:-$(this).width()})
			$(this).children('.a2').find('.p6').css({transform:'scale(1.3)'})
			$(this).children('.a2').find('.p7').css({bottom:'-50px'})
		})
		</script>