添加到百度首页
添加收藏 RSS 网站地图 旧版网站
  • 全部
  • 网页特效
  • 建站教程
  • 设计分享
当前位置:首页 > 网页特效 > 图文相册 >

jQuery鼠标滑过文字渐隐渐现动画效果

时间:2014-11-19      来源:互联网     
特效说明:
"一款jQuery鼠标滑过文字渐隐渐现动画效果网页特效,鼠标滑过图片列表每一张图片之后渐变显示图片标题名称,鼠标滑走文字标题渐变消失。(兼容测试:IE7及以上、Firefox、Chrome、Opera、Safari、360等主流浏览器)
使用方法:
1、调用CSS样式:
<link rel="stylesheet" type="text/css" href="css/style.css" />

2、调用JS插件代码:
<script src="js/jquery-1.8.3.min.js"></script>

3、添加HTML代码:
<!--效果html开始-->......<!--效果html结束-->之间的html和js代码;放在<body></body>之间。

4、代码片段:
$(function(){
    $(".section ul li .rsp").hide();
    $(".section     ul li").hover(function(){
        $(this).find(".rsp").stop().fadeTo(500,0.5)
        $(this).find(".text").stop().animate({left:'0'}, {duration: 500})
    },function(){
        $(this).find(".rsp").stop().fadeTo(500,0)
        $(this).find(".text").stop().animate({left:'318'}, {duration: "fast"})
        $(this).find(".text").animate({left:'-318'}, {duration: 0})
    });
});
相关特效

最新更新特效

设计分享