我有一个完全可以运行的GPA计算器Web应用程序。我希望它具有响应性,但是似乎智能手机和平板电脑存在一些错误。

似乎对于平板电脑而言,内容适合于台式机版本,但是,当您单击某个字段时,将页面放大到该特定输入。之后,用户必须向右滚动才能访问所有其他输入字段...



FullPage.js不允许这种类型的滚动,因为它会自动滑动到下一个水平页面:这是输出部分。

我确实希望我的结果和输入区域是两个不同的页面,并且我知道不存储数据的唯一方法就是将其放在具有幻灯片功能的网页上。有没有办法在Fullpage.Js中启用水平滚动,或者禁用幻灯片,除非他们按下某个按钮?有没有更好的方法来实现这一目标?

这是网站:http://gpacalc.tk/

最佳答案

$('#fullpage').fullpage({
    css3: true,
    slidesNavigation: true,
    normalScrollElements: '.slide'

});


$('body').on('DOMMouseScroll mousewheel', function (e) {
    if(e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) { //alternative options for wheelData: wheelDeltaX & wheelDeltaY
      //scroll down
      $.fn.fullpage.moveSlideRight();
    } else {
      //scroll up
      $.fn.fullpage.moveSlideLeft();
    }
    //prevent page fom scrolling
    return false;
});


在“ Alvaro”和http://jsfiddle.net/honk1/gWnNv/7/的帮助下

10-05 20:36
查看更多