jQuery Touch
This plugin adds Apple iPod/iPhone (firmware 2.0+) touch functionality to jQuery. Use built in Touch methods including ontouchstart, ontouchend, ontouchmove, ongesturestart, ongesturechange and ongestureend.
You may specify what options you want available for the specified target(s), including: animate, dragx, dragy, rotate, resort and scale.
Written By: Peter Schmalfeldt ( Manifest Interactive )
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
INFORMATION:
animate: (optional bool | default true) Simulates the Apple Touch Flick gesture and allows an item to be thrown. Speed is automatically determined.
dragx: (optional bool | default true) Allows dragging along the X axis. Using only one axis locks the dragging to that axis. Setting both axis' to true will allow you to drag in any direction.
dragy: (optional bool | default true) Allows dragging along the Y axis. Using only one axis locks the dragging to that axis. Setting both axis' to true will allow you to drag in any direction.
rotate: (optional bool | default false) Allow the element to be rotated.
resort: (optional bool | default true) Set the z-index of the current element on top of the others ontouchstart.
scale: (optional bool | default false) Allow the element to be scaled.
NOTE: This is only functional an the Apple iPod/iPhone running version 2.0+. Elements also need to have a unique ID in order for jQuery Touch to communicate correctly. Also, I am currently working on the ability to allow for a "sticky" element. This will soon allow you to apply this plugin to a scrolling text box and be able to scroll its entirety without having the content just move to wherever your finger is located.
SAMPLE USAGE:
$('.myclass').touch({
animate: true,
sticky: false,
dragx: true,
dragy: true,
rotate: true,
resort: true,
scale: true
});
$('#myelement').touch({
animate: false,
sticky: false,
dragx: true,
dragy: true,
rotate: false,
resort: true,
scale: false
});
-
判断移动端还是pc端 function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = new Array( "Android" , "iPhone" , "SymbianOS" , "Windows Phone" , "iPad" , "iPod"
-
jQuery的touchstart,touchmove,touchend的获取位置 $('#webchat_scroller').on('touchstart',function(e) { var touch = e.originalEvent.targetTouches[0]; var y = touch.pageY; }); $
-
封装函数 尽管 DOM 提供了 API ，可是当我们使用 DOM API 的时候却不尽人意，它提供的功能实在是有限，并且有些方法还没有，所以我们先来封装两个函数。第一个函数作用是获取一个元素节点的所有兄弟，第二个函数作用是可以对一个节点添加或者删除 class 。 获取一个元素节点的所有兄弟 当调用 getSiblings 函数的时候只需要传入一个元素节点即可。 1 2 3 4 5 6 7 8 9
-
一、html5移动端：元素拖动（js） <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0" /> <title></title> <style> *{ margin
-
在使用touch事件是会出现touchstart后touchend不执行的问题这时候只需要加一行代码即可： $("body").on("touchstart", function(e) { e.preventDefault(); }); 但是有人在谷歌浏览器或许会发现报错，这时候换成下面这行代码就可以解决： $("body").on("touchstart", function(e)
-
1. jQuery 修改input输入框type属性时报错的处理 uncaught exception type property can’t be changed 使用代码$("#pwd").attr("type","password")时出现上面的错误。 猜测是该版本jQuery不允许修改控件type属性，使用原生js语句可以解决这个问题。 $("#txtpwd").focus(functio
-
When first time I got to learn about web ,I thought it is just run in browsers .But one day ,I was told to build a web page which can run in mobile browsers .At that moment ,I thought it doesn't mak
-
首先为了防止事件触发默认行为，我们需要去禁止，安全的禁止方法： // 判断默认行为是否可以被禁用 if (e.cancelable) { // 判断默认行为是否已经被禁用 if (!e.defaultPrevented) { e.preventDefault(); } } 三个事件： $("body").on("t
-
转自：http://extjs.org.cn/node/519 如果你正在面临是选择 jQuery Mobile 或者是 Sencha Touch ，那么下面这些因素是你需要考虑的。 jQuery Mobile JM 只是一个 UI 库，依赖于 jQuery 和 jQuery UI 的 DOM 操作、Ajax 和其他库 为了创建 UI 部件，你只需要编写 HTML 即可，JM 为了对这些 HTML
-
js代码： $("body").on("touchstart", function(e) { // 判断默认行为是否可以被禁用 if (e.cancelable) { // 判断默认行为是否已经被禁用 if (!e.defaultPrevented) { e.preventDefault(); } }
-
var touchStart, touchEnd, touchDiff = 80; $(window).on({ 'touchstart': function (e) { touchStart = e.originalEvent.changedTouches[0].clientY; },