让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 ...
随机推荐
- CSS的绝对定位和相对定位
css定位标签position包括两个值:relative(相对定位)和absolute(绝对定位),position样式一般都是和top.bottom.left.right一起使用来确定一个标签的位 ...
- centos 下 yum 安装 nginx 平滑切换安装到 Tengine
---恢复内容开始--- 据说淘宝的Tengine很牛X,所以我们今天也来玩玩,我们这里是某开放云的vps,现在已经安装好了nginx,现在我们要平滑切换到安装Tengine. 下载Tengine,解 ...
- About GAC
http://blogs.msdn.com/b/msbuild/archive/2007/04/12/new-reference-assemblies-location.aspx http://web ...
- POJ2221+模拟
参考http://blog.sina.com.cn/s/blog_7de5c6210100tm1h.html 其实是水题............ #include<string.h> #i ...
- ANDROID_MARS学习笔记_S02_006_APPWIDGET2_PendingIntent及RemoteViews实现widget绑定点击事件
一.代码流程 1.ExampleAppWidgetProvider的onUpdate(Context context, AppWidgetManager appWidgetManager, int[] ...
- altium6.x中自动删除重复走线的位置
在protel 2004 DXP中,“自动删除走线”的位置就在"PCB Editor"的默认页面,非常好找. 但是升级到了altium 6.7,6.9之后,很多人就找不到这个了. ...
- Android 多屏幕适配
问题: 测试时,发现应用在不同的显示器上显示效果不同(部分文本不能显示完全),自然想到屏幕适配的问题. 按照思路整理如下: (一) 几个概念 1, Screen size 屏幕的尺寸,即对角线长度(单 ...
- linux编译安装git
我的博客:www.while0.com 用的centos6.4中自带的git,版本为1.7.1,配置好github的sshkey后,clone下来的项目无法提交,提示: fatal: Unable t ...
- PHP FTP上传文件
第一步:建立一个新的 FTP 连接. ftp_connect(host,port,timeout); host必需,规定要连接的 FTP 服务器,可以是域名或 IP 地址,后面不应以斜线结 ...
- 【HDOJ】1222 Wolf and Rabbit
最大公约数,辗转相除. #include <stdio.h> long long gcd(long long a, long long b) { if (a<b) return gc ...