Javascript jQuery swipeleft和swiperight
所以我有一个小的滑动框,你可以滑动前后箭头来滚动内容。但我想给它添加滑动功能,这是我第一次弄乱任何滑动的东西,所以我有点迷路,下面是我玩的代码Javascript jQuery swipeleft和swiperight,javascript,jquery,Javascript,Jquery,所以我有一个小的滑动框,你可以滑动前后箭头来滚动内容。但我想给它添加滑动功能,这是我第一次弄乱任何滑动的东西,所以我有点迷路,下面是我玩的代码 //script for sliders var currentlyAnimating = false; $('.box-left').click(slideleft); $( ".r-wide-box" ).on( "swipeleft", slideleft); $('.box-right, .phone-next-serv').click(s
//script for sliders
var currentlyAnimating = false;
$('.box-left').click(slideleft);
$( ".r-wide-box" ).on( "swipeleft", slideleft);
$('.box-right, .phone-next-serv').click(slideright);
$( ".r-wide-box" ).on( "swiperight", slideright);
function slideleft ( ){
var width = $(".wide-box > .row-fluid-wrapper").width();
if (currentlyAnimating) {
return;
}
currentlyAnimating = true;
$('.wide-box > .row-fluid-wrapper:last').prependTo('.wide-box');
$('.wide-box').css('left', -width);
$('.wide-box').animate({
left: '0px'
}, 500, 'linear', function() {
$('.wide-box').css('left', '0px');
currentlyAnimating = false;
});
}
function slideright ( ){
var width = $(".wide-box > .row-fluid-wrapper").width();
if (currentlyAnimating) {
return;
}
currentlyAnimating = true;
$('.wide-box').animate({
left: -width
}, 500, 'linear', function() {
$('.wide-box').css('left', '0px');
$('.wide-box > .row-fluid-wrapper:first').appendTo('.wide-box');
currentlyAnimating = false;
});
};
只需要添加jquery库
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
JQuery没有为移动设备定义事件,如刷卡、触摸等
理想情况下,当开发移动应用程序或支持响应式布局设计时,需要这些事件。只有这样,才需要这些事件。因此,它只在JQuery mobile中定义,而不是在JQuery中定义
添加jquery mobile可能会奏效,但我建议不要添加它,只是为了支持刷卡事件,因为jquery mobile的设计目的完全不同,即通过为页面、标题等提供预定义属性来开发移动应用程序
谷歌搜索可以提供一些支持触摸事件的好库。你确定要添加jquery移动库吗?我没有,谢谢。的确,在添加jquery mobile之后,我的布局开始出现一些奇怪的事情,但我将继续研究其他库的布局。谢谢。我知道我迟到了,但也许是因为别人。您只能使用触摸屏支持构建自己的jquery mobile: