让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 ...
随机推荐
- DOS下文件操作命令
文件名是由文件路径和文件名称合起来的,如C:\DOS\COMMAND.COM. DIR 显示文件和文件夹(目录). 用法:DIR [文件名] [选项] 它有很多选项,如/A表示显示所有文件(即包括带隐 ...
- 探索Microsoft.NET目录
所在目录:D:\Windows\Microsoft.NET(d盘为系统盘) 文件目录 |--D:\Windows\Microsoft.NET |------assembly |------GAC_32 ...
- css中table-layout:fixed 属性的用法
table-layout:fixed 属性的用法:如果想要一个table固定大小,里面的文字强制换行(尤其是在一长串英文文本,并且中间无空格分隔的情况下),以达到使过长的文字 不撑破表格的目的,一般是 ...
- 关于 IIS 上的 Speech 设置
在之前的开发过程中,发现在 微软各个版本的Speech中(从sdk5.1 到 最新的 Speech PlatFarme V11),在本地可以生成音频文件,但是在IIS上却生成无法生成完整的文件. 调试 ...
- BigDecimal除法
public class TestDemo { public static void main(String[] args) { BigDecimal dataValue = new BigDecim ...
- mysql function 与 procedure
Mysql 的 function 和 procedure 有啥区别呢 ? 网上搜索后说 function 有返回值, procedure 无返回值. 1.return 从function 的语法角度 ...
- HTTP Keep-Alive详解
HTTP是一个请求<->响应模式的典型范例,即客户端向服务器发送一个请求信息,服务器来响应这个信息.在老的HTTP版本中,每个请求都将被创建一个新的客户端->服务器的连接,在这个连接 ...
- php获得当前日期时间 date函数
time()得到从1970-01-01到现在共走了多少秒 要找出前一天的时间就是 time()-60*60*24; 要找出前一年的时间就是 time()*60*60*24*365 那么如何把这个数字换 ...
- Android SurfaceView实现全屏播放例子
public class Mymedia extends Activity implements OnBufferingUpdateListener, OnCompletionListener, Me ...
- hdu4632Palindrome subsequence
http://acm.hdu.edu.cn/showproblem.php?pid=4632 TLE了N次 原因居然是取模次数太多了..! 这数据卡的好紧 还是我写的太搓..828ms挤过 s[i]= ...