实例在 <p> 元素开始拖动时执行 JavaScript:<p draggable="true" ondrag="myFunction(event)">拖动我!</p>定义和用法ondrag 事件在元素或者选取的文本被拖动时触发。拖放是 HTML5 中非常常见的功能。 更多信息可以查看我们 HTML 教程中的 HTML5 拖放。注意： 为了让元素可拖动，需要使用 HTML5 draggable 属性。提示： 链接和图片默认是可拖动的，不需要 draggable 属性。在拖放的过程中会触发以下事件：在拖动目标上触发事件 (源元...
实例在用户完成 <p> 元素的拖动时执行 JavaScript :<p draggable="true" ondragend="myFunction(event)">拖动我!</p>定义和用法ondragend 事件在用户完成元素或首选文本的拖动时触发。拖放是 HTML5 中非常常见的功能。 更多信息可以查看我们 HTML 教程中的 HTML5 拖放。注意： 为了让元素可拖动，需要使用 HTML5 draggable 属性。提示： 链接和图片默认是可拖动的，不需要 draggable 属性。在拖放的过程中会触发以下事件：在拖动目...
[导读] 拖拽事件 通过拖拽事件，咱们就可以控制拖拽很多东西了。其中什么元素或者是哪里发生了拖拽事件是最关键的。有些事件是在被拖动的元素上触发，有些事件是在放置目标上触发的。拖动某元素时候，触发的事件有：拖拽事件 通过拖拽事件，咱们就可以控制拖拽很多东西了。其中什么元素或者是哪里发生了拖拽事件是最关键的。有些事件是在被拖动的元素上触发，有些事件是在放置目标上触发的。拖动某元素时候，触发的事件有：...
这篇文章主要介绍了浅谈HTML5 服务器推送事件（Server-sent Events） ，具有一定的参考价值，有兴趣的可以了解一下服务器推送事件（Server-sent Events）是基于WebSocket 协议的一种服务器向客户端发送事件&数据的单向通讯。目前所有主流浏览器均支持服务器发送事件，当然除了 Internet Explorer 。2333...WebSocket 协议是继HTTP协议后又一服务器客户端通讯协议，不同于HTTP单纯的客户端请求服务器响应单向通讯模式的是它支持了服...
传统的WEB应用程序通信时的简单时序图：现在Web App中，大都有Ajax，是这样子： HTML5有一个Server-Sent Events(SSE)功能，允许服务端推送数据到客户端。(通常叫数据推送)。基于数据推送是这样的，当数据源有新数据，它马上发送到客户端，不需要等待客户端请求。这些新数据可能是最新闻，最新股票行情，来自朋友的聊天信息，天气预报等。数据拉与推的功能是一样的，用户拿到新数据。但数据推送有一些优势。 你可能听说过Comet, Aja...
当前窗口获得焦点js事件，html5发布之前我们使用window.onfocus和window.onblur来获得窗口焦点和失去窗口焦点//当前窗口得到焦点 window.onfocus = function() { //播放动画或视频 }; //当前窗口失去焦点 window.onblur = function() { //暂停动画或视频 };这个方法可以实现切换标签暂停动画视频，但是会带来一个问题，由于是判断焦点，如果是在当前页面上铺上一个小窗口，那当前页面就暂停了动画，试想，如果你一边看片，一边...
HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续添加分享。今天为大家介绍的事件主要是触摸事件：touchstart：触摸开始的时候触发touchmove：手指在屏幕上滑动的时候触发touchend：触摸结束的时候触发而每个触摸事件都包括了三个触摸列表，每个列表里包含了对应的一系列触摸点（用来实现多点触控）：touc...
HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续添加分享。touchstart、touchmove和touchend事件 一开始触摸事件touchstart、touchmove和touchend是iOs版Safari浏览器为了向开发人员传达一些信息新添加的事件。因为iOs设备既没有鼠标也没有键盘，所以在为移动Safari浏览器开发交互性网页的时候，PC端的...
HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续添加分享。touchstart、touchmove和touchend事件 一开始触摸事件touchstart、touchmove和touchend是iOs版Safari浏览器为了向开发人员传达一些信息新添加的事件。因为iOs设备既没有鼠标也没有键盘，所以在为移动Safari浏览器开发交互性网页的时候，PC端的...
本篇完成这样一个例子，让主角随着鼠标移动，效果如下：update函数和上一篇一致，代码如下：然后来看init的初始化部分，和上一篇的示例一样，代码如下：然后分别定义mousedown，mousemove，mouseup，分别对应鼠标按下，移动和抬起。代码分别如下：首先用如下代码获得坐标，如下代码使用于各种浏览器：var mx,my; if(ev.layerX || ev.layerX==0){ mx = ev.layerX; my = ev.layerY; }else if(ev.offsetX || ev.offsetX==0){ mx = ev....
浏览器支持Internet Explorer 9、Firefox、Opera 12、Chrome 以及 Safari 5 支持拖放。注释：在 Safari 5.1.2 中不支持拖放。HTML5 拖放实例<!DOCTYPE html> <html> <head> <style type="text/css"> #p1 {width:488px;height:70px;padding:10px;border:1px solid #aaaaaa;} </style> <script type="text/javascript"> function allowDrop(ev) { ev.preventDefault(); } function drag(ev) { ev.dataTransfer.setData("T...
很多网站当复制粘贴的时候，都会出现有关剪贴板的相关提示，在刚刚入行前端工程师的时候，我还在一直纳闷，这是怎么实现的呢。如今，咱们再也不用纳闷了，因为已经有浏览器把剪贴板相关事件纳入标准了。 IE是最早支持与剪贴板相关的事件，以及通过JavaScript访问剪贴板数据的浏览器。IE的实现成为了事实上的标准，随后Firefox 3+ 、 Chrome和Safari 2+都支持类似的事件和剪贴板的访问，但是Opera不支持通过JavaScript访问剪贴板...
拖拽事件 通过拖拽事件，咱们就可以控制拖拽很多东西了。其中什么元素或者是哪里发生了拖拽事件是最关键的。有些事件是在被拖动的元素上触发，有些事件是在放置目标上触发的。拖动某元素时候，触发的事件有：dragstart事件、drag事件和dragend事件。 按下鼠标键并开始移动鼠标的时候，会在被拖拽的元素上触发dragstart事件。这时候光标变成”不能放”符号(圆环中有一条反斜线)，表示不能把元素放在自己上门。拖拽开始时，可以...
HTML5中的媒体元素除了拥有很多的属性之外，video标签和audio标签还可以出发很多事件和方法。这些方法监控着不同的属性的变化，这些变化有可能是媒体播放的结果，也可能是用户操作媒体的结果。下面就为大家开始介绍媒体元素的相关事件。 abort：触发时机是下载中断。 canplay：在可以播放的时候，readyState的值为2的时候触发。 canplaythrough：readyState的值为3的时候，触发。播放可以继续，而应该不会中断的时候触发。...
HTML5中新添加了很多事件，但是由于他们的兼容问题不是很理想，应用实战性不是太强，所以在这里基本省略，咱们只分享应用广泛兼容不错的事件，日后随着兼容情况提升以后再陆续添加分享。今天为大家介绍的事件主要是触摸事件：touchstart、touchmove和touchend。 一开始触摸事件touchstart、touchmove和touchend是iOs版Safari浏览器为了向开发人员传达一些信息新添加的事件。因为iOs设备既没有鼠标也没有键盘，所以在为移动Safar...