jQuery开发的metro风格热搜词文字标签云模板代码，蓝色色调，矩形文字，鼠标放上去有遮挡效果，效果不错。这也是一款仿百度新闻热搜词的特效，可用于图片或文字钢琴jquery效果。
效果
核心代码
<script type="text/javascript" src="js/jquery-1.3.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.caption').hover(function(){
$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});
}, function() {
$(".cover", this).stop().animate({top:'50px'},{queue:false,duration:300});
});
});
</script>
</head>
<body>
<div class="da_div">
<div class="boxgrid caption">
欢迎加入中国食用菌商务网
<div class="boxcaption cover">
<p><a href="#" target="_blank">欢迎加入中国食用菌商务网</a></p>
</div>
</div>
<div class="boxgrid boxgrid2 caption">
查看食用菌行情
<div class="boxcaption boxcaption2 cover">
<p><a href="#" target="_blank">查看食用菌行情</a></p>
</div>
</div>
<div class="boxgrid boxgrid3 caption">
最新买卖求购信息
<div class="boxcaption boxcaption2 cover">
<p><a href="#" target="_blank">最新买卖求购信息</a></p>
</div>
</div>
<div class="boxgrid boxgrid2 reci caption">
冬季食用菌保暖知识
<div class="boxcaption boxcaption2 cover">
<p><a href="#" target="_blank">冬季食用菌保暖知识</a></p>
</div>
</div>
<div class="boxgrid reci2 caption">
欢迎订阅食用菌市场杂志
<div class="boxcaption cover">
<p><a href="#" target="_blank">欢迎订阅食用菌市场杂志</a></p>
</div>
</div>
<div class="boxgrid boxgrid2 reci2 caption">
打造食用菌品牌
<div class="boxcaption boxcaption2 cover">
<p><a href="#" target="_blank">打造食用菌品牌</a></p>
</div>
</div>
</div>
资源下载
© 版权声明
文章版权归作者所有，未经允许请勿转载。
相关文章
暂无评论...
优网导航，专注收录与分享优质网站、工具、资源，打造一站式导航网！
友链申请，请右侧加微信联系站长！
