jQuery 在移动（触摸）设备上禁用 fullpage.js
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22457529/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable fullpage.js on mobile (touch) devices
提问by patrickzdb
I'm using fullpage.js and the slimscroll.js plugin, which is required to allow scrolling in a section which has content that exceeds the height it's container section.
我正在使用 fullpage.js 和 slimscroll.js 插件，这是允许在内容超过容器部分高度的部分中滚动所必需的。
I've noticed that the experience is quite bad on touch devices. Whereas normally you can swipe, release and watch the page still scroll, on a slimscroll div as soon as your finger leaves the touch area, the scrolling stops.
我注意到触摸设备的体验非常糟糕。通常情况下，您可以滑动、松开并观看页面仍在滚动，但在 slimscroll div 上，只要您的手指离开触摸区域，滚动就会停止。
So what I'd like to do is disable fullpage.js on mobiles and tablets, but still enable it on desktops. I checked out fullPage.js's issues and documentation but I couldn't find a simple way of doing this.
所以我想做的是在手机和平板电脑上禁用 fullpage.js，但仍然在台式机上启用它。我查看了 fullPage.js 的问题和文档，但找不到一种简单的方法。
Could anyone help me out?
有人可以帮我吗？
Thanks a lot
非常感谢
采纳答案by Alvaro
Just don't initialize fullpage on touch devices. You will have to deal with the mobile/touch devices detection. Just search a bit on google or even here to find different alternatives.
只是不要在触摸设备上初始化整页。您将不得不处理移动/触摸设备检测。只需在谷歌或什至在这里搜索一下即可找到不同的替代方案。
It should look like this:
它应该是这样的：
var isPhoneDevice = [ WHATEVER FUNCTION YOU WANT TO USE ]
//if it is not a phone device...
if(!isPhoneDevice){
//initializing fullpage...
$.fn.fullpage();
}
UPDATE
更新
At the moment fullpage.js provides another alternative. Using the responsiveWidthand responsiveHeightoptions.
This way fullpage.js will act as a normal website under the given values (in px).
目前 fullpage.js 提供了另一种选择。使用responsiveWidth和responsiveHeight选项。这样 fullpage.js 将在给定值（以 px 为单位）下充当普通网站。
This can also be combined with the class fp-auto-height-responsivein order to prevent fullPage.js to set the sections height on responsive and let you total control over them.
这也可以与类结合使用，fp-auto-height-responsive以防止 fullPage.js 在响应式上设置部分高度并让您完全控制它们。
More in the docs.
文档中的更多内容。
回答by ahkeno
I use this way!
我用这个方法！
var isPhoneDevice = "ontouchstart" in document.documentElement;
$(document).ready(function() {
if(isPhoneDevice){
//mobile
}
else{
//desktop
$.fn.fullpage();
}
});
回答by user3654265
Even easier way that I came across here on Stackexchange- this is what I'm using:
我在 Stackexchange 上遇到的更简单的方法- 这就是我正在使用的：
if(screen.width < 480) {
// do any 480 width stuff here, or simply do nothing
return;
} else {
// do all your cool stuff here for larger screens
}
回答by Pavel Timoshenko
Responsive design possibilities have been added to fullPage.jssince last answer. You can seen example by the following link.
fullPage.js自上次回答以来，已经添加了响应式设计的可能性。您可以通过以下链接查看示例。
Read about responsiveWidthand responsiveHeightin documentationfor details.
阅读 aboutresponsiveWidth和responsiveHeightin文档了解详细信息。
