addEventlistener监听的事件完成一次后自动取消与jquery的one方法比较;animate动画制作,arguments.callee的用法
<!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的用法的更多相关文章
- [JS]笔记12之事件机制--事件冒泡和捕获--事件监听--阻止事件传播
-->事件冒泡和捕获-->事件监听-->阻止事件传播 一.事件冒泡和捕获 1.概念:当给子元素和父元素定义了相同的事件,比如都定义了onclick事件,点击子元素时,父元素的oncl ...
- JS 中的事件绑定、事件监听、事件委托
事件绑定 要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有 ...
- javascript事件监听与事件委托
事件监听与事件委托 在js中,常用到element.addEventListener()来进行事件的监听.但是当页面中存在大量需要绑定事件的元素时,这种方式可能会带来性能影响.此时,我们可以用事件 ...
- 在Javascript中监听flash事件(转)
在Javascript中监听flash事件,其实有两种做法: 1.在特定的环境下(例如专门制作的flash),大家约定一个全局函数,然后在flash的事件中用ExternalInterface.cal ...
- vue监听滚动事件,实现滚动监听
在vue中实现滚动监听和原生js无太大差异,下面是一个简单的demo,可在控制台查看结果 <!DOCTYPE html> <html lang="en"> ...
- Vue 爬坑之路(七)—— 监听滚动事件 实现动态锚点
前几天做项目的时候,需要实现一个动态锚点的效果 如果是传统项目,这个效果就非常简单.但是放到 Vue 中,就有两大难题: 1. 在没有 jQuery 的 animate() 方法的情况下,如何实现平滑 ...
- vue监听滚动事件-元素固定位置显示
1.监听滚动事件 用VUE写一个在控制台打印当前的scrollTop用来测试是否执行: mounted () { window.addEventListener('scroll', this.hand ...
- vue监听滚动事件 实现某元素吸顶或者固定位置显示
https://blog.csdn.net/wang1006008051/article/details/78003974 1.监听滚动事件 利用VUE写一个在控制台打印当前的scrollTop, 首 ...
- JS 事件绑定、事件监听、事件委托详细介绍
原:http://www.jb51.net/article/93752.htm 在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定.事件监听.事件委托(事件代 ...
随机推荐
- PHP程序输出日历
以下代码只是简单实现日历的效果和逻辑思路,没有使用类封装,权当抛砖引玉,有兴趣的朋友可以封装起来,方便调用. <?php /** * PHP利用时间函数输出日历 * Rain.zen $ int ...
- centos之tomcat安装
1.环境说明 系统:centos, 2.6.32-573.el6.x86_64; tomcat: apache-tomcat-7.0.68 2.下载文件并上传 下载apache-tom ...
- winform跨线程
在winform中经常用到多线程,那么用多线程对控件进行赋值和修改的时候呢会出现类似“该控件不是当前线程创建”的错误信息,在winform中两种办法: 1.在加载事件中写这句话,其作用呢就是线程的异步 ...
- Linux 安装xtrabackup的依赖问题
问题: 尝试安装xtrabackup rpm -ivh percona-xtrabackup-2.2.11-1.el7.x86_64.rpm 报错 perl(DBD::mysql) 被 percona ...
- Delphi通过IE窗口句柄获取网页接口(IWebBrowser2) good
主要用到的是MSAA(Microsoft Active Accessibility) 函数:ObjectFromLResult,该函数在动态链接库 oleacc.dll 中定义. uses SHDoc ...
- 编辑器sublime text 加入到右键菜单
方式一: 1. 运行中输入 regedit 打开注册表 2. 在HKEY_CLASSES_ROOT/*/shell/ 下新建’项’ ,名称自己觉得.我用的是Sublime Text 3 ...
- php导出CSV时,超长数字精度丢失问题与前导0的字符串丢失0的问题解决
php生成的CSV有时候会遇到两个特殊情况: 1.输出的字段中,含有超长数字(18位的数字)比方身份证:122121197410180016,就算输出时字段加上"",还是会被识别成 ...
- 从零开始学习UNITY3D(GUI篇 2)
复合控件极其使用,toolbar,selectgrid 先看效果图: toolbar可以看作是一个button按钮的集合,一次只能点击一个按钮, selectgrid又可以堪称是一个toolbar的集 ...
- xcode - 触摸移动
第一步 创建一个UIView类 命名MoveView #import "MoveView.h" @implementation MoveView /** 移动事件 */ -(vo ...
- DataGridView插入一行数据和用DataTable绑定数据2种方式
以前不会用DataGridView的时候一直使用DataTable绑定的方式,如下: DataTable table = new DataTable(); //给表添加一列Name,此名字和 tabl ...