QQ抖动效果

所属分类:其他-动画效果

 34460  346  查看评论 (3)
分享到微信朋友圈
X
QQ抖动效果 ie兼容6

使用步骤

head区域引用样式表

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

引入JS文件

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

在BODY区域加入图片代码

<div id="bk"><img src="images/qq.png" width="543"></div>
相关插件-动画效果

jQuery简单的真心话大冒险游戏文字随机抽取大冒险

jquery简单的真心话大冒险游戏文字随机抽取大冒险
  动画效果
 50048  457

jQuery canvas实现圣诞下雪效果

canvas实现圣诞下雪效果,这个下雪效果有点炫.
  动画效果
 37841  383

css3实现鲨鱼游动(酷)

css3实现鲨鱼游动,效果非常酷哦。
  动画效果
 38168  414

jQuery手机网页点赞效果

常用网页、移动端的点赞效果
  动画效果
 32041  384

讨论这个项目(3)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    对方正在输入... 0
    2021/8/30 18:21:40

    看我压缩后的JS代码:

    function jqShake(elm) {
        var $elm = $(elm);
        if (!$elm.length)
            return;
        var obj = $elm[0],
            left = obj.offsetLeft,
            top = obj.offsetTop;
        obj.style.left = obj.offsetLeft + 'px';
        obj.style.top = obj.offsetTop + 'px';
        obj.style.position = 'absolute';
        obj.style.margin = 0;
        var click = function() {
            var cn = parseInt($elm.attr('data-shake-cn') || 30);
            if (cn < 2) {
                obj.style.left = left + 'px';
                obj.style.top = top + 'px';
                $elm.attr('data-shake-cn', 30);
                return console.log('cn end...');
            }
            obj.style.left = left + ((cn % 2) > 0 ? -2 : 2) + 'px';
            obj.style.top = top + ((cn % 2) > 0 ? -2 : 2) + 'px';
            $elm.attr('data-shake-cn', --cn);
            setTimeout(click, 30);
        }
        obj.onclick = click;
    }
    
    
    window.onload = function() {
        jqShake('#bk');
    }
    回复
    Low energy children are forbidden to enter. 0
    2016/10/6 15:10:56

    哈哈哈! 以为女人主动找你似的。基于IE6真是必须点赞。如果是我,一定是用animation

    回复
    Annie 0
    2015/12/7 15:12:55
    hacker 0
    2013/12/6 18:41:00
    时光小屋 0
    2013/8/7 10:21:00
    哇喔,这个效果好~ 回复
    大圣 0
    2013/8/5 13:13:00
    不错,效果非常逼真! 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复