jQuery鼠标经过图片滑动弹出标题效果代码

使用方法：

引入CSS样式文件

<link href="css/style.css" rel="stylesheet" type="text/css" />

引入jQuery库文件

<script type="text/javascript" src="js/jquery.1.4.2.min.js"></script>

JS结构

$(document).ready(function(){
	$('.listimg').hover(function(){
		$(".summary",this).stop().animate({top:'110px'},{queue:false,duration:180});
	},function(){
		$(".summary",this).stop().animate({top:'165px'},{queue:false,duration:180});
	});
});

HTML结构

<div class="listimg">
    <a href="/"><img src="images/260x165.jpg" class="attachment-thumbnail wp-post-image" alt="图片特效,网页特效,js特效,jquery特效" /></a>
    <div class="summary">
        <div class="summarytxt">
            <p>适合做图片类网站的特效，鼠标经过弹出标题，效果很不错</p>
        </div>
    </div>
</div>