让BOOTSTRAP默认SLIDER支持触屏设备
var isTouch=('ontouchstart' in window);
if(isTouch){
$(".carousel").on('touchstart', function(e){
var that=$(this);
var touch = e.originalEvent.changedTouches[];
var startX = touch.pageX;
var startY = touch.pageY;
$(document).on('touchmove',function(e){
touch = e.originalEvent.touches[] ||e.originalEvent.changedTouches[];
var endX=touch.pageX - startX;
var endY=touch.pageY - startY;
if(Math.abs(endY)<Math.abs(endX)){
if(endX > ){
$(this).off('touchmove');
that.carousel('prev');
}else if (endX < -){
$(this).off('touchmove');
that.carousel('next');
}
return false;
}
});
});
$(document).on('touchend',function(){
$(this).off('touchmove');
});
}
让BOOTSTRAP默认SLIDER支持触屏设备的更多相关文章
- javascript如何判断访问网页的设备及是否支持触屏功能
var system ={}; var p = navigator.platform; system.win = p.indexOf("Win") == 0; system.mac ...
- 在触屏设备上面利用html5裁剪图片
前言 如今触屏设备越来越流行,并且大多数已经支持html5了.针对此.对触屏设备开发图片裁剪功能, 让其能够直接处理图片.减轻服务端压力. 技术点 浏览器必须支持html5,包含fileReader. ...
- 在触屏设备上面利用html5裁剪图片(转)
前言 现在触屏设备越来越流行,而且大多数已经支持html5了.针对此,对触屏设备开发图片裁剪功能, 让其可以直接处理图片,减轻服务端压力. 技术点 浏览器必须支持html5,包括fileReader, ...
- jquery -- 触屏设备touch事件
几种普及得比较好的触摸事件,你可以在绝大多数现代浏览器中来测试这一事件(必须是触屏设备哦): touchstart:触摸开始的时候触发 touchmove:手指在屏幕上滑动的时候触发 touchend ...
- 在触屏设备中拖动 overflow 元素
在 Android 和 iOS 等触屏设备中,如果网页中某元素设置 overflow: auto 或者 overflow:scroll,那么问题就来了.在 Android 3.0 之前以及 iPhon ...
- 基于jQuery的移动轮播图(支持触屏)
移动轮播图我看到两款, 一款是无线天猫的m.tmall.com,实现了无缝轮播. 一款是蘑菇街的,没有实现无缝轮播. 我自己重写一个,类似蘑菇街 <!doctype html> <h ...
- 支持触屏的jQuery轮播图插件
移动轮播图我看到两类, 一款是无线天猫的m.tmall.com和携程,实现了无缝轮播. 一款是蘑菇街的,没有实现无缝轮播. 我自己重写一个,类似天猫. 1.页面代码 <!DOCTYPE html ...
- Bootstrap幻灯轮播如何支持触屏左右滑动手势?
最近ytkah在学习用bootstrap搭建网站,Bootstrap能自适应pc端和手机端,并且移动设备优先,适合现如今移动营销.bootstrap是封装好的框架,需要某些功能只需调用相应的组件就可以 ...
- 解决电脑访问Discuz!手机版(支持触屏版)
discuz电脑访问手机版的方法现在需要来修改一下2个文件,即可用电脑浏览discuz的手机版本:找到./source/function/function_core.php 文件,查找 : funct ...
随机推荐
- C#.net winform 控件和皮肤大全
1. 东日IrisSkin IrisSkin 共有两个版本,一个是IrisSkin.dll 用于.Net Framework1.0/1.1 和IrisSkin2.dll 用于.Net Framewor ...
- 数据结构-------单链表(C++)
相关信息: /** * @subject 数据结构 实验2 * @author 信管1142班 201411671210 赖俊杰 * @project 单链表 * @time 2015年10月29日1 ...
- AMH4.2免费版手动编译升级Nginx1.8版本方法
从AMH免费版本停留在4.2版本之后就没有进行更新和升级,而且官方提供的解决文档也比较少,毕竟免费且没有盈利的产品还是没有多少兴趣的.但是,对于大部分网站环境来说,安装和使用AMH4.2免费版本还是够 ...
- centos SSH配置详解
基本概念 linux自带的ssh为OpenSSH ssh协议提供两种用户认证方式 1. 基于口令的安全认证:使用用户名.密码的方式对登录用户进行认证 2. 基于密钥的安全认证:使用公钥和私钥对的方 ...
- 如何成为python高手(转)
http://www.cnblogs.com/xupeizhi/p/3207976.html#2896469 如何成为python高手 本文是从 How to become a proficient ...
- gdb查看虚函数表、函数地址
1. 查看函数地址 看函数在代码的哪一行,使用info line就可以看到类似下面这中输出 点击(此处)折叠或打开 (gdb) info line a.cpp:10 Line 10 of &q ...
- java代码转换为c# 工具
Demo Java to C# Converter.exe 已下载到 F:\SoftWare-new\java\Java_to_CSharp_Converter.rar
- VJP1456 最小总代价(状压)
链接 这题卡了一天 刚开始没考虑第一个传的和最后一个传的 感觉挺简单 啪啪的敲完 居然还过了17组数据.. 正解:dp数组一维保存状态 一维保存当前传到了谁 再枚举是由谁传过来的 这样可以保证正确性 ...
- JSOI2009 游戏
1443: [JSOI2009]游戏Game Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 557 Solved: 251[Submit][Stat ...
- [swustoj 585] 倒金字塔
倒金字塔(0585) Time limit(ms): 3000 Memory limit(kb): 65535 Submission: 208 Accepted: 48 Description S ...