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的事件机制,例如,事件绑定.事件监听.事件委托(事件代 ...
随机推荐
- android 获取http网络图片保存png
1.android 获取网络图片的方式很多,普通网络通信的方式都可以用在获取网络图片上. android http获取数据常用的方式: 1.Apache接口(HttpClient) 2.标准Jav ...
- 在cad中画一条长500mm,垂直90度的线段
视频教程奉上 方法1.点击线段按钮,鼠标指定一点,输入500,再输入<90. 方法2,点击线段按钮,鼠标指定一点,输入500,按tab,再输入90.
- Linux下diff使用简介
diff用来比较两个文件的差异.首先构建两个相似的文件. Hello文件 world文件 使用diff -u hello world > diff.txt,将两个文件的比对结果输入到diff. ...
- 自绘Tab控件
自绘tab按钮效果图如下: 使用例子: MyTabControl *tabControl = NULL; tabControl = new MyTabControl();tabControl-> ...
- java把函数作为参数传递
public class Tool { public void a()// /方法a { System.out.print("tool.a()..."); } public voi ...
- .Net C# ASP.Net和ADO.Net
1.NET是一个平台,一个抽象的平台的概念. .NET平台其本身实现的方式其实还是库,抽象层面上来看是一个平台. .NET Framework包括两个关键组成元素: a.Common Language ...
- SlidingMenu的编译及使用
1. 在github上有一个效果不错的开源库,SlidingMenu 最新的代码下载下来后,ExampleListActivity项目会报错: No resource found that ...
- ZOJ 1563 Pearls(动态规划)
/* 分析: 因为他给的数据是递增的 而求得是这些数据总的 最优解 所以我们可以考虑,它的子问题求解不影响总的求解 也就是我们可以先求出 第一个的最优解 第二个....以此类推到总的最优解 那么我们想 ...
- VS2015使用scanf报错解决方案
版权声明:本文为博主原创文章,未经博主允许不得转载. 方法一:在程序最前面加#define _CRT_SECURE_NO_DEPRECATE: 方法二:在程序最前面加#define _CRT_SECU ...
- 保护眼睛,绿豆沙颜色的RGB值和HSL值
现在的人尤其是职场中人,每天都得花很长时间对着电脑,对眼睛的伤害很大,其实我们可以对电脑进行一个简单的设置,把窗口背景设置成绿豆沙颜色的,对眼睛的保护很有帮助的. 下面是绿豆沙颜色的RGB值和HSL值 ...