jquery实现点击页面计算点击次数
作者:bea
代码很简单,这里就不多废话了,直接奉上: 代码如下: $(function(){ var w=0,tip=$("<b>"); tip.css({ "z-index":99999,position:"absolute",color:"red",display:"none" }), $("body").append(tip),//页面创建b标签用来显示数字 $(document).on("click",function(e){ var
代码很简单,这里就不多废话了,直接奉上:
代码如下:
$(function(){
var w=0,tip=$("<b>");
tip.css({
"z-index":99999,position:"absolute",color:"red",display:"none"
}),
$("body").append(tip),//页面创建b标签用来显示数字
$(document).on("click",function(e){
var x=e.pageX,y=e.pageY;//获取点击页面坐标
tip.text("+"+ ++w).css({//数字加1
display:"block",top:y-15,left:x,opacity:1//定位显示
}).stop(!0,!1).animate({//stop(stopAll,goToEnd),如果发生多次点击时,要停止上一个动画的执行
top:y-180,opacity:0},800,function(){
tip.hide()
}),
e.stopPropagation()
});
});
代码就到这里了,希望小伙伴们喜欢。
有用 | 无用
代码如下:
$(function(){
var w=0,tip=$("<b>");
tip.css({
"z-index":99999,position:"absolute",color:"red",display:"none"
}),
$("body").append(tip),//页面创建b标签用来显示数字
$(document).on("click",function(e){
var x=e.pageX,y=e.pageY;//获取点击页面坐标
tip.text("+"+ ++w).css({//数字加1
display:"block",top:y-15,left:x,opacity:1//定位显示
}).stop(!0,!1).animate({//stop(stopAll,goToEnd),如果发生多次点击时,要停止上一个动画的执行
top:y-180,opacity:0},800,function(){
tip.hide()
}),
e.stopPropagation()
});
});
代码就到这里了,希望小伙伴们喜欢。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- javascript折半查找详解
- JavaScript数据类型检测代码分享
- 浅谈Javascript中的Function与Object
- javascript实现动态加载CSS
- 使用jQuery实现返回顶部
- SyntaxHighlighter 3.0.83使用笔记
- AngularJS iframe跨域打开内容时报错误的解决办法
- JavaScript事件委托用法分析
- jQuery统计上传文件大小的方法
- 限制上传文件大小和格式的jQuery插件实例
- jQuery将所有被选中的checkbox某个属性值连接成字符串的方法
- 使用jQuery实现input数值增量和减量的方法
- Javascript 拖拽雏形中的一些问题(逐行分析代码,让你轻松了拖拽的原理)
- Javascript 拖拽雏形(逐行分析代码,让你轻松了拖拽的原理)
- Javascript 拖拽的一些简单的应用(逐行分析代码,让你轻松了拖拽的原理)
- Javascript 完美运动框架(逐行分析代码,让你轻松了运动的原理)
- Javascript 拖拽的一些高级的应用(逐行分析代码,让你轻松了拖拽的原理)
- jQuery选择器querySelector的使用指南
- jQuery中DOM操作实例分析