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 相关文章推荐
javascript中SetInterval与setTimeout的定时器用法
Aug 24 Javascript
跟我学习javascript的基本类型和引用类型
Nov 16 Javascript
特殊日期提示功能的实现方法
Jun 16 Javascript
利用canvas中toDataURL()将图片转为dataURL(base64)的方法详解
Nov 20 Javascript
AngularJs 最新验证手机号码的实例,成功测试通过
Nov 26 Javascript
bootstrap模态框关闭后清除模态框的数据方法
Aug 10 Javascript
详解微信JS-SDK选择图片遇到的坑
Aug 15 Javascript
使用Angular 6创建各种动画效果的方法
Oct 10 Javascript
浅谈vuex actions和mutation的异曲同工
Dec 13 Javascript
vue中 this.$set的用法详解
Sep 06 Javascript
Vue实现鼠标经过文字显示悬浮框效果的示例代码
Oct 14 Javascript
JavaScript实现淘宝商品图切换效果
Apr 29 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批量上传图片的具体实现方法介绍.
2014/02/26 PHP
PHP下SSL加密解密、验证、签名方法(很简单)
2020/06/28 PHP
PHP中addslashes()和stripslashes()实现字符串转义和还原用法实例
2016/01/07 PHP
PHP5.5安装PHPRedis扩展及连接测试方法
2017/01/22 PHP
php使用Jpgraph创建柱状图展示年度收支表效果示例
2017/02/15 PHP
CI(CodeIgniter)框架视图中加载视图的方法
2017/03/24 PHP
php实现自定义中奖项数和概率的抽奖函数示例
2017/05/26 PHP
PHP使用mysqli同时执行多条sql查询语句的实例
2019/03/22 PHP
PHP函数用法详解【初始化、嵌套、内置函数等】
2020/06/02 PHP
Jquery插件之打造自定义的select标签
2011/11/30 Javascript
javascript 判断是否是微信浏览器的方法
2016/10/09 Javascript
原生JS实现图片网格式渐显、渐隐效果
2017/06/05 Javascript
详解Angular2响应式表单
2017/06/14 Javascript
JS检测是否可以访问公网服务器功能代码
2017/06/19 Javascript
Bootstrap 中data-[*] 属性的整理
2018/03/13 Javascript
微信小程序实现运动步数排行功能(可删除)
2018/07/05 Javascript
js实现黑白div块画空心的图形
2018/12/13 Javascript
VuePress 静态网站生成方法步骤
2019/02/14 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
微信小程序解析富文本过程详解
2019/07/13 Javascript
vue3实现v-model原理详解
2019/10/09 Javascript
Nuxt的路由动画效果案例
2020/11/06 Javascript
[57:55]完美世界DOTA2联赛PWL S3 Magma vs Phoenix 第二场 12.12
2020/12/16 DOTA
常见的在Python中实现单例模式的三种方法
2015/04/08 Python
Python 备份程序代码实现
2017/03/06 Python
Python开发的HTTP库requests详解
2017/08/29 Python
Python操作Redis之设置key的过期时间实例代码
2018/01/25 Python
对Python Pexpect 模块的使用说明详解
2019/02/14 Python
Python importlib动态导入模块实现代码
2020/04/16 Python
python 实现rolling和apply函数的向下取值操作
2020/06/08 Python
《猴子种树》教学反思
2014/02/14 职场文书
关于青春的演讲稿800字
2014/08/22 职场文书
三严三实对照检查材料范文
2014/09/23 职场文书
董事长助理工作总结2015
2015/07/23 职场文书
保外就医申请书范文
2015/08/06 职场文书
忠诚教育学习心得体会
2016/01/23 职场文书