jquery实现点击页面计算点击次数


Posted in Javascript onJanuary 23, 2015

代码很简单,这里就不多废话了,直接奉上:

$(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 相关文章推荐
JQuery 引发两次$(document.ready)事件
Jan 15 Javascript
Javascript实现的类似Google的Div拖动效果代码
Aug 09 Javascript
JavaScript直播评论发弹幕切图功能点集合效果代码
Jun 26 Javascript
Bootstrap 网站实例之单页营销网站
Oct 20 Javascript
web前端开发upload上传头像js示例代码
Oct 22 Javascript
Javascript this 函数深入详解
Dec 13 Javascript
详解JavaScript RegExp对象
Feb 04 Javascript
jquery拼接ajax 的json和字符串拼接的方法
Mar 11 Javascript
使用puppeteer破解极验的滑动验证码
Feb 24 Javascript
js实现图片跟随鼠标移动效果
Oct 16 Javascript
微信小程序地图绘制线段并且测量(实例代码)
Jan 02 Javascript
echarts 使用formatter 修改鼠标悬浮事件信息操作
Jul 20 Javascript
jQuery中DOM树操作之复制元素的方法
Jan 23 #Javascript
PHP实现的各种中文编码转换类分享
Jan 23 #Javascript
jQuery中DOM树操作之使用反向插入方法实例分析
Jan 23 #Javascript
PHPExcel中的一些常用方法汇总
Jan 23 #Javascript
jQuery操作DOM之获取表单控件的值
Jan 23 #Javascript
使用angular写一个hello world
Jan 23 #Javascript
Javascript中的几种URL编码方法比较
Jan 23 #Javascript
You might like
编写安全 PHP应用程序的七个习惯深入分析
2013/06/08 PHP
PHP中大括号'{}'用法实例总结
2017/02/08 PHP
微信第三方登录(原生)demo【必看篇】
2017/05/26 PHP
php中的buffer缓冲区用法分析
2019/05/31 PHP
将字符串中由空格隔开的每个单词首字母大写
2014/04/06 Javascript
浅谈EasyUI中Treegrid节点的删除
2015/03/01 Javascript
jquery实现的动态回到顶部特效代码
2015/10/28 Javascript
使用重写url机制实现验证码换一张功能
2017/08/01 Javascript
vue 使某个组件不被 keep-alive 缓存的方法
2018/09/21 Javascript
JavaScript实现滑动门效果
2020/01/18 Javascript
JS实现横向轮播图(初级版)
2020/06/24 Javascript
jQuery操作选中select下拉框的值代码实例
2020/02/07 jQuery
在vue中使用el-tab-pane v-show/v-if无效的解决
2020/08/03 Javascript
关于element-ui表单中限制输入纯数字的解决方式
2020/09/08 Javascript
[36:14]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第二局
2016/02/28 DOTA
Python压缩和解压缩zip文件
2015/02/14 Python
在Python的setuptools框架下生成egg的教程
2015/04/13 Python
python如何通过实例方法名字调用方法
2018/03/21 Python
Pycharm中安装Pygal并使用Pygal模拟掷骰子(推荐)
2020/04/08 Python
详解python3 GUI刷屏器(附源码)
2021/02/18 Python
Web页面中八种创建多列等高(等高列布局)的实现技术
2012/12/24 HTML / CSS
浅析HTML5中header标签的用法
2016/06/24 HTML / CSS
普通PHP程序员笔试题
2016/01/01 面试题
寻找迷宫的一条出路,o通路;X:障碍
2016/07/10 面试题
焊接专业毕业生求职信
2013/10/01 职场文书
档案接收函范文
2014/01/10 职场文书
大学军训感言
2014/01/10 职场文书
初三物理教学反思
2014/01/21 职场文书
总账会计岗位职责
2014/03/13 职场文书
关于青春的演讲稿
2014/05/05 职场文书
2014县委书记四风对照检查材料思想汇报
2014/09/21 职场文书
2014办公室年度工作总结
2014/12/09 职场文书
任长霞观后感
2015/06/16 职场文书
舞出我人生观后感
2015/06/16 职场文书
详解Nginx 被动检查服务器的存活状态
2021/10/16 Servers
Python 恐龙跑跑小游戏实现流程
2022/02/15 Python