欢迎提供更好的方法！

<!--http://www.cnblogs.com/webzhangnan/p/3244920.html -->

<html>

    <head>

        <title>IOS shake by conan</title>

        <style type="text/css">

            .box{

                display: -webkit-box;

                padding: 20px;

            }

            .icon{

                height: 100px;

                width: 100px;

                margin: 20px;

                background: red;

            }

            #start{

                width: 200px;

                height: 60px;

                line-height: 60px;

                text-align: center;

                margin: 10px;

                border: 1px solid #ddd;

            }

        </style>

    </head>

    <body>

        <div class="box">

            <div class="icon"></div>

            <div class="icon"></div>

            <div class="icon"></div>

            <div class="icon"></div>

        </div>

        <div id="start">run shake</div>

    <script type="text/javascript">

    shake = function($item) {

        if ($item.length) {

            var timeIdAry = [] , len = $item.length;

            while(len--) timeIdAry.push(shake($item[len]));

            return function() {

                var stop;

                while (stop = timeIdAry.shift()) {

                    stop();

                }

            }

        } else {

            var timeId, runing = true,

                duration = '-webkit-transition: -webkit-transform 100ms;',

                d = false;

            var loop = function() {

                if (!runing) return;

                if(!$item.getAttribute('pause'))

                    $item.style.cssText = duration + '-webkit-transform: translate3d(' + (d ? 0 : 0) + 'px,' + (d ? 0 : 0) + 'px, 0) rotate(' + (d ? -1 : 1) + 'deg);-webkit-transform-origin: '+(d ? 20 : 80) + '% ' + (d ? 80 : 20) + '%'

                d = !d;

                timeId = setTimeout(loop, 100);

            }

            loop();

            return function() {

                clearTimeout(timeId);

                $item.setAttribute('style', '');

                delete $item;

                loop = null;

                itemId = runing = null;

            }

        }

    }

        var icons = document.querySelectorAll('.icon');

        var stop;

        document.querySelector('#start').addEventListener('click', function(){

            if(stop) stop(),stop=null,this.innerHTML = 'run shake';

            else stop = shake(icons), this.innerHTML = 'kill shake';

        });

        var s = icons.length , EV = 'ontouchstart' in window ? {start : 'touchstart',end:'touchend'} : {start : 'mouseover',end:'mouseout'};

        while(s--){

            icons[s].addEventListener(EV.start, function(e){

                e.target.setAttribute('pause', 1);

                e.target.setAttribute('style', '-webkit-transform: scale(1.5);-webkit-transition: -webkit-transform 100ms;opacity:.5');

            });

            icons[s].addEventListener(EV.end, function(e){

                e.target.setAttribute('pause', '');

            });

        }

    </script>    

    </body>

</html>

js实现IOS上删除app时颤抖动画j函数的更多相关文章

  1. 上传App时遇IDFA错误问题

    今天上传App时遇到下图1的情况,很纳闷,又是苹果新规. 通常是第三方的库引起啦,马上想到百度统计了,打开SDK下载页面看看简单介绍,里面有讲到这个问题了. 图2就是这次改动的原因. 更新SDK,之前 ...

  2. iOS 上传APP到AppStore 卡在 Authenticating with the iTunes store 提示

    上传APP的时候,遇到了问题,一直卡在Authenticating with the iTunes store提示这里, 解决办法:在Application Loader里面登录需要上传APP的开发者 ...

  3. app混合开发 fastlick.js 在ios上 input标签点击 不灵敏 处理

    ios11 上有这个问题 而老版本的ios没有 会出现这个的原因是使用fastclick.js点击后input没有获取焦点,所以只需要在fasyclick的源码的这个位置 可以直接在源码内搜索关键字找 ...

  4. iOS: 上传App到AppStore，由于Xcode上传太慢，换成Application Loader上传，速度秒传

    一.遇到的遭遇 在之前的项目开发中,本人有点固执,一直采用xcode打包后再上传,结果可想而知: (1)要么上传时速度慢的跟蜗牛似的,等的我心力交瘁(不排除网络不给力的原因,公司这个吊问题快把我气疯了 ...

  5. iOS上传App Store报错：this action cannot be completed -22421 解决方案

    最近swift项目升了xcode8,提交版本时,遇到这个: this action cannot be completed -22421 瞬间懵逼,连具体报错原因都没有,只有一个代码 22421,找了 ...

  6. 50.IOS上传APP问题

    更新版本的时候遇到几个问题 1.ERROR ITMS-90535: "Unexpected CFBundleExecutable Key. The bundle at 'Payload/di ...

  7. iOS 上传App Store提示WARNING ITMS-90703错误的说明

    今天上传app到appstore的时候,上传到最后一步的时候,报了一个警告: 原文如下: WARNING ITMS-90703: "Deprecated Xcode Build. Due t ...

  8. iOS 后台退出app时不执行applicationWillTerminate的临时解决方法

    - (void)applicationDidEnterBackground:(UIApplication *)application { // Use this method to release s ...

  9. JS判断语句 注意多句时加大括号 回调函数LODOP兼顾写法

    由于C-LODOP获取一些动作函数的返回值,需要用回调函数,由于常见的使用方法是混合部署,也就是同一个页面,根据浏览器的不同,可能会走LODOP ,也可能会走C-LODOP,因此写法要坚固两种,而有些 ...

随机推荐

  1. 【转】C语言中access函数

    头文件:unistd.h 功 能: 确定文件或文件夹的访问权限.即,检查某个文件的存取方式,比如说是只读方式.只写方式等.如果指定的存取方式有效,则函数返回0,否则函数返回-1. 用 法: int a ...

  2. sqlserver同一个局域网内，把服务器数据库备份到客户端

    1.客户端主机创建网络共享文件夹 2.远程服务器运行: EXEC sp_configure 'show advanced options', 1;-- 允许配置高级选项--配置选项'show adva ...

  3. CSU 1259 bfs找最短路

    题目大意: 不想介绍,题目链接:http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1259 bfs求最短路. 这里因为2-9,到达同样的点不计步数,那我 ...

  4. ****Call to a member function item() on a non-object

    A PHP Error was encountered Severity: Error Message: Call to a member function item() on a non-objec ...

  5. 洛谷 P1065 作业调度方案

    P1065 作业调度方案 题目描述 我们现在要利用 mm 台机器加工 nn 个工件,每个工件都有 mm 道工序,每道工序都在不同的指定的机器上完成.每个工件的每道工序都有指定的加工时间. 每个工件的每 ...

  6. Ubuntu 16.04下操作iptables的技巧（解决Failed to start iptables.service: Unit iptables.service not found.或者/etc/init.d/iptables: 没有那个文件或目录）

    /etc/init.d/iptables网上的解法应该都是基于CentOS 6去实践,而在CentOS 7中又被firewalld给取代,所以操作上的写法基本会改变,但是底层iptables则不会改变 ...

  7. 【SQL Server 学习系列】-- SQL查询数据库表字段值不为空或Null的所有列

    ) set @TableName = 'Agency' -- 表名 declare @querySql nvarchar(max) set @querySql = 'select ' ) declar ...

  8. 【.Net 学习系列】-- 反射的简单用法

    新建两个项目:类库(Model)和控制台应用程序(ReflectTest). 在[Model]中添加一个类[User]: namespace Model { public class User { p ...

  9. easyui根据id获取列索引

    easyui根据row中的某个元素获取该列的索引,看了下api好像没有直接的方法,那只能自己写了 首先,id只是一个概念,不一定非得id,只要该列是唯一值,或者是主键就行. 假如我的列是这样的结构 { ...

  10. Oracle生成多表触发器sql

    --将所有HY开头的表都生成一个更新触发器的脚本('/'是为了连续创建多个触发器而不报错)select 'CREATE OR REPLACE TRIGGER '||table_name||' BEFO ...