文号
t60095
阅读
3478
回复
1
收藏
2
jquery实现图片遮罩动画过渡提示特效
2013/08/27
IP:吉林
此作品是一款效果非常好看的Jquery特效,实现图片遮罩动画过渡提示效果,应用范围很广,可以使用到产品展示、相册展示里面,加上了此特效就多了一类似flash实现的动画效果,利用Jquery的动画插件animate实现的。。。
01
$(document).ready(function() {
02
    $(".hdpic dd a").hover(function() {
03
        $(this).find(".picshine").stop();
04
        $(this).find(".picshine").css("background-position", "-235px 0");
05
        $(this).find(".picshine").animate({
06
            backgroundPosition: '235px 0'
07
        },
08
        500);
09
        $(this).find(".pictitle").stop().animate({
10
            left: '0px'
11
        },
12
        {
13
            queue: false,
14
            duration: 450
15
        });
16
    },
17
    function() {
18
        $(this).find(".pictitle").stop().animate({
19
            left: '-235px'
20
        },
21
        {
22
            queue: false,
23
            duration: 200
24
        });
25
    });
26
});

转自 开源中国 邓剑彬 发布于 2013年08月15日 15时 39d2b6efce1b9d16fcbe82b9f2deb48f8d546484.jpg
13年4个月前IP:未同步
564027
1楼
程序高手[s:271]
引用
评论
笔记
{{note.content}}
{{n.user.username}}
{{fromNow(n.toc)}} {{n.status === noteStatus.disabled ? "已屏蔽" : ""}} {{n.status === noteStatus.unknown ? "正在审核" : ""}} {{n.status === noteStatus.deleted ? '已删除' : ''}}
  • 编辑
  • 删除
  • {{n.status === 'disabled' ? "解除屏蔽" : "屏蔽" }}
我也是有底线的