<div style="width:200px; height:20px; position:fixed; top:0; left:0; background-color:blue;">
<span id="x"></span>-
<span id="y"></span>-
<span id="v"></span>-
<span id="w"></span>
</div>
<script>
$('html').mousemove(function(){
$("#x").text(event.pageX);
$("#y").text(event.pageY);
$("#v").text(event.clientX);
$("#w").text(event.clientY);
})
$('html').click(function(){
var wdWidth = document.body.scrollWidth;
var wdHeight = document.body.scrollHeight;
var x = event.pageX;
var y = event.pageY;
//alert(x + ' ' + y + ' ' + wdWidth + ' ' + wdHeight);
draw(x,y);
})
</script> <canvas id="yuanxing" width="1300px" height="1300px" style="position:absolute;top:0;left:0;"> </canvas>
<script type=text/javascript>
function draw(x,y,r){
var r = arguments[3] || 20;
var canvas=document.getElementById("yuanxing");
var context=canvas.getContext("2d");
context.fillStyle="blue";
context.beginPath();
context.arc(x,y,r,0,Math.PI*2,true); //Math.PI*2是JS计算方法,是圆
context.closePath();
context.fill();
}
</script>

  

jquery canvas 用户点击记录的更多相关文章

  1. js记录用户行为浏览记录和停留时间(转)

    演示地址:http://weber.pub/demo/160902/test.html 测试源码下载:http://pan.baidu.com/s/1nvPKbSP 密码:r147 解决问题所使用的知 ...

  2. 利用jQuery实现用户名片小动画

    我爱撸码,撸码使我感到快乐!大家好,我是Counter.下面给大家介绍利用jQuery实现的小动画,非常的简便,如果有原生js操作的话,那么就不止这么多行了.至于CSS,个人觉得,这边CSS布局也蛮重 ...

  3. JavaScript 实现用户点击图片放大

    JavaScript 实现用户点击图片放大 一.契机 情况是这样的,之前推荐朋友去建站.后面他专门写了一篇文章说如何实现 "用户点击图片实现放大效果",俺就好好 "拜读& ...

  4. 用户点击确认登录,自动跳转下面地址得到code

    PHP获取微信openid 简单教程 WEB   2014年10月29日  10868浏览  6评论 获取code https://open.weixin.qq.com/connect/oauth2/ ...

  5. Bootstrap 模态框在用户点击背景空白处时会自动关闭

    问题: Bootstrap 模态框在用户点击背景空白处时,会自动关闭. 解决方法: 在HTML页面中编写模态框时,在div初始化时添加属性 aria-hidden=”true” data-backdr ...

  6. jquery 实现重复点击一个元素时不重复执行效果

    jquery 实现重复点击一个元素时不重复执行效果 这需要用到jquery的stop方法 实例 停止当前正在运行的动画: $("#stop").click(function(){ ...

  7. 通过统计用户DNS解析记录,实现监控用户上网行为

    上次通过扫描抓包分析TTL的方式检测公司网络开放的端口,发现没有开放53端口(DNS),也就是在公司内部的主机只能用服务器自动分配的DNS,并且发现这是台内部服务器.今天发现bing上不去,检测后发现 ...

  8. 酷!使用 jQuery & Canvas 制作相机快门效果

    在今天的教程中,我们将使用 HTML5 的 Canvas 元素来创建一个简单的摄影作品集,它显示了一组精选照片与相机快门的效果.此功能会以一个简单的 jQuery 插件形式使用,你可以很容易地整合到任 ...

  9. C#-WinForm-弹窗提示框-如何知道用户点击的是哪个按钮?

    MessageBox.Show() 有21个重载 常用的弹窗提示框 1.一个参数,弹窗只有一个选项 2.三个参数,第一个参数是设置弹窗消息框中的文字内容:第二个参数是设置弹窗标题栏中显示的文本:第三个 ...

随机推荐

  1. WPF 分辨率无关性原理

    WPF在计算窗口尺寸大小时使用的是系统的DPI设置.WPF窗口以及窗口中所有的元素都是使用设备无关单位度量.一个设备无关单位被定义为1/96英寸. [物理单位尺寸]=[设备无关单位尺寸]*[系统DPI ...

  2. ZooKeeper Java例子(六)

    A Simple Watch Client 为了向你介绍ZooKeeper Java API,我们开发了一个非常简单的监视器客户端.ZooKeeper客户端监视一个ZooKeeper节点的改变并且通过 ...

  3. iOS 隐藏/显示导航栏

    一.隐藏导航栏 [self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBa ...

  4. iOS tag的使用

    一.添加标记 (标记不能为0) UIButton *backBtn = [[UIButton alloc] initWithFrame:CGRectMake(,,,)]; backBtn.backgr ...

  5. Java面试总结mysql

    1.根据部门号从高到低,工资从低到高列出每个员工的信息. SELECT * FROM  User ORDER BY deptid DESC ,salary 2.用一条sql语句查询出每门课都大于80的 ...

  6. vue_真机调试页面

    使用vue开发也有一段时间,是说我太懒了,还是说太懒了.得总结总结的. 之前在开发的时候都是,npm run build把页面打包后再上传到代码库上线用手机看页面效果.样式调整,嗯,很麻烦很傻的. 今 ...

  7. mybatis 显示 sql日志

    #项目日志logging.level.com.zhang.com=debug #mybatis sql相关日志显示logging.level.org.mybatis.spring=DEBUGloggi ...

  8. Python标准库笔记(1) — string模块

    String模块包含大量实用常量和类,以及一些过时的遗留功能,并还可用作字符串操作. 1. 常用方法 常用方法 描述 str.capitalize() 把字符串的首字母大写 str.center(wi ...

  9. 9.quartus_warning_altera_reserved_tck

    编译的时候没有注意,整个工程都可以在板子上跑起来.但是做Powerplay的时候,出现了这个Critical Warning:. Critical Warning: The following clo ...

  10. Linux内核堆栈使用方法 进程0和进程1【转】

    转自:http://blog.csdn.net/yihaolovem/article/details/37119971 目录(?)[-] 8 Linux 系统中堆栈的使用方法 81  初始化阶段 82 ...