<!doctype html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=yes"/>

     <title>Document</title>

     <style>

         *{margin:0;padding:0}

         html,body{width:100%;height:100%;overflow: hidden;position:relative}

         #div1{width:100%;height:100%;background: #f0f;position: absolute}

         #div2{width:100%;height:100%;background: #00f;position: absolute;left:0}

         .top{top:100%;}

         .bottom{top:0}

         .hide{display: none}

     </style>

     <link rel="stylesheet" href="animate.min.css"/>

 </head>

 <div id="div1" class="animated">

 </div>

 <div id="div2" class=" bottom hide">

 </div>

 <body>

 <script src="jquery.js"></script>

 <script>

 //    $(function(){

 //

 //        $("#div1").click(function(){

 //            $("#div2").one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {

 //                $("#div2").removeClass(effect);

 //            });

 //            var effect = 'animated bounceInUp';

 //            $("#div2").removeClass("hide").addClass(effect);

 //        })

 //        $("#div2").click(function(){

 //            $("#div2").one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function() {

 //                $("#div2").removeClass(effect).addClass("hide");

 //            });

 //            var effect = 'animated bounceOutDown';

 //            $("#div2").addClass(effect);

 //

 //        })

 //    })

 </script>

 <script>

     $(function(){

         $("#div1")[0].addEventListener("click",function(){

             alert(11);

         $("#div1")[0].removeEventListener("click",arguments.callee,false)

         },false)

     })

 </script>

 </body>

 </html>

addEventlistener监听的事件完成一次后自动取消与jquery的one方法比较；animate动画制作，arguments.callee的用法的更多相关文章

  1. [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播

    -->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...

  2. JS 中的事件绑定、事件监听、事件委托

    事件绑定 要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有 ...

  3. javascript事件监听与事件委托

      事件监听与事件委托 在js中,常用到element.addEventListener()来进行事件的监听.但是当页面中存在大量需要绑定事件的元素时,这种方式可能会带来性能影响.此时,我们可以用事件 ...

  4. 在Javascript中监听flash事件(转)

    在Javascript中监听flash事件,其实有两种做法: 1.在特定的环境下(例如专门制作的flash),大家约定一个全局函数,然后在flash的事件中用ExternalInterface.cal ...

  5. vue监听滚动事件，实现滚动监听

    在vue中实现滚动监听和原生js无太大差异,下面是一个简单的demo,可在控制台查看结果 <!DOCTYPE html> <html lang="en"> ...

  6. Vue 爬坑之路（七）—— 监听滚动事件 实现动态锚点

    前几天做项目的时候,需要实现一个动态锚点的效果 如果是传统项目,这个效果就非常简单.但是放到 Vue 中,就有两大难题: 1. 在没有 jQuery 的 animate() 方法的情况下,如何实现平滑 ...

  7. vue监听滚动事件-元素固定位置显示

    1.监听滚动事件 用VUE写一个在控制台打印当前的scrollTop用来测试是否执行: mounted () { window.addEventListener('scroll', this.hand ...

  8. vue监听滚动事件 实现某元素吸顶或者固定位置显示

    https://blog.csdn.net/wang1006008051/article/details/78003974 1.监听滚动事件 利用VUE写一个在控制台打印当前的scrollTop, 首 ...

  9. JS 事件绑定、事件监听、事件委托详细介绍

    原:http://www.jb51.net/article/93752.htm 在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定.事件监听.事件委托(事件代 ...

随机推荐

  1. jquery实现点击改变背景色，点击其他恢复原来背景色，被点击的改变背景色

    实现这个功能很简单,可是之前自己不怎么熟悉jquery,感觉各种乱写.现在终于整理好了思路. html: <div class="managementPanel"> & ...

  2. Android 获取有规律资源Id解决方案

    在多个有规律的资源ID获取的时候,可以使用getIdentifier方法来获取,来获取. 用到场景:工具类打成.jar包的时候,有时候会需要引用到res中的资源,这时候不能将资源一起打包,只能通过反射 ...

  3. cad2007 钢筋符号显示为问号

    如题:cad2007 钢筋符号显示为问号 解决办法:下载Tssdeng,解压(Tssdeng.rar) 把下载到的cad大字体Tssdeng.shx文件放到autoCAD2007安装目录C:\Prog ...

  4. 编程策略类note

    2016-1-15 LOG LOG最重要的作用即是为程序出bug时调试提供思路, 一个自定义的log,需要有几个要素: 1. 时间,以知道哪些log是我们所需要的, 2. 标签,判断哪些log是属于哪 ...

  5. Flex4开发笔记(与JAVA交互)

    (由于本人也是第一次接触flex开发,因此将开发过程中问题记录留档) 一.数据交换过程 借助BlazeDS可以实现flex与java之间的数据交互,大体流程如下: 1.导入blazeds的文件(配置w ...

  6. [问题解决] initAndListen: 10309 Unable to create/open lock file: /data/db/mongod.lock

    错误: 在linux下开启mongoDB的 $ >bin: ./mongod 时报错:initAndListen: 10309 Unable to create/open lock file: ...

  7. [问题解决] locale::facet::_S_create_c_locale name not valid

    错误: exception in initAndListen: 14043 clear tmp files caught exception exception: locale::facet::_S_ ...

  8. 从零开始学 iOS 开发的15条建议

    事情困难是事实,再困难的事还是要每天努力去做是更大的事实. 因为我是一路自学过来的,并且公认没什么天赋的前提下,进步得不算太慢,所以有很多打算从零开始的朋友会问我,该怎么学iOS开发.跟粉丝群的朋友交 ...

  9. java.util.Timer分析源码了解原理

    Timer中最主要由三个部分组成: 任务 TimerTask .  任务队列: TaskQueue queue 和 任务调试者:TimerThread thread 他们之间的关系可以通过下面图示: ...

  10. 记录一下八款开源 Android 游戏引擎

    记录一下八款开源 Android 游戏引擎 虽然android学了点点,然后现在又没学了(我为啥这么没有恒心呢大哭).以后有时间还是要继续学android的,一定要啊!虽然现在没学android游戏编 ...