javascript判断是否手机设备+滑动事件

//判断是否手机端

var isMobile = false;

try {

//手机端

document.createEvent("TouchEvent");

isMobile = true;

} catch (e) {

//pc

}

//手势事件

var startX = 0, endX = 0, move_left = null;

//按下时触发

$(‘元素‘).on(‘touchstart‘, function (e) {

e.preventDefault()

var touch = event.touches[0];

startX = touch.pageX;

})

//移动时触发

$(‘元素‘).on(‘touchmove‘, function (e) {

var touch2 = event.touches[0];

endX = touch2.pageX;

})

//离开时触发

$(‘元素‘).on(‘touchend‘, function (e) {

time = setInterval(picTimer, opts.Time)

if (!scrollList.is(":animated")) {

e.preventDefault()

if (startX > endX) {

index += 1;

if (index == len) { index = 0; }

showPics(index);

} else {

index -= 1;

if (index == -1) { index = len - 1; }

showPics(index);

}

}

}

不会到会,只是一个过程!

时间: 2024-08-06 13:38:02

javascript判断是否手机设备+滑动事件的相关文章

javascript判断设备类型-手机(mobile)、安卓(android)、电脑(pc)、其他(ipad/iPod/Windows)等

使用device.js检测设备并实现不同设备展示不同网页 html代码: <!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <script src="device.js"></script> </head> <body style="margin: auto

asp.net或javascript判断是否手机访问

 Welcome to CSU Online Judge! 1112: 机器人的指令 Time Limit: 1 Sec  Memory Limit: 128 MB Submit: 274  Solved: 97 [Submit][Status][Web Board] Description 数轴原点有一个机器人.该机器人将执行一系列指令,你的任务是预测所有指令执行完毕之后它的位置. ·LEFT:往左移动一个单位 ·RIGHT: 往右移动一个单位 ·SAME AS i: 和第i 条执行相同的

javascript判断移动应用手势滑动屏幕方向

方案思路: 1.滑动屏幕事件使用HTML5 的 touchstart 滑动开始事件和 touchend 滑动结束事件. 2.方向的判断,以起点做平面坐标系,与终点连线做直线,直线与x正半轴计算角度:我们以45度角为方向分割线,如:只要滑动角度大于等于45度且小于135度,则判断它方向为向上滑. 3.使用Math.atan2()来计算起点与终点形成的直线角度. 4.仔细对比标准坐标系与屏幕坐标系,我们发现,标准坐标系,上半轴为负值,要实现转换,只需要调换Y坐标起点与终于位置即可. 代码实现: [网

Javascript判断鼠标点击右击事件

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> window.onload = function(){ //去掉默认的contextmenu事件,否则会和右键事件同时出现. document.on

JavaScript判断当前手机是Android还是iOS系统

1 $(function () { 2 var u = navigator.userAgent, app = navigator.appVersion; 3 var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g 4 5 //要先判断当前是什么系统,否则会报错,无法执行语句 6 if (isAndroid) { 7 console.log(isAndroid); 8 }else{ 9 if (navig

原生JavaScript判断是否移动设备

function isMobile(){ if (typeof this._isMobile === 'boolean'){ return this._isMobile; } var screenWidth = this.getScreenWidth(); var fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport

移动设备、手机浏览器Javascript滑动事件代码

以下经过本人测试成功. 测试平台:三星S5830I 操作系统:Android 2.3.6 浏览器:UC浏览器 HTML标准:HTML5 测试了三个事件:touchstart.touchmove 和 touchend,并获取了触摸时触点在页面上的坐标,根据坐标进行了左右滑动.上下滑动判断. 代码如下: <!-- HTML5 --> <!DOCTYPE html> <html> <head> <title>TouchEvent测试</title

javascript如何判断是手机还是电脑访问本网页

1 var system ={}; 2 var p = navigator.platform; 3 system.win = p.indexOf("Win") == 0; 4 system.mac = p.indexOf("Mac") == 0; 5 system.x11 = (p == "X11") || (p.indexOf("Linux") == 0); 6 if(system.win||system.mac||syst

javascript判断手机浏览器版本信息

<script type="text/javascript"> /* * 智能机浏览器版本信息: * */ var browser={ versions:function(){ var u = navigator.userAgent, app = navigator.appVersion; return {//移动终端浏览器版本信息 trident: u.indexOf('Trident') > -1, //IE内核 presto: u.indexOf('Presto