滚动不适用于移动设备(谷歌浏览器和Firefox)

我在webflow的一个网站中使用了scrollify插件(https://projects.lukehaas.me/scrollify/#home),但该插件在网络上无法正常工作,但是我在移动浏览器中打开该插件后,滚动条完全无法使用铬和Firefox。这是我的代码

预期的行为- 滚动应该可以在移动设备上使用。

实际行为- 滚动在Chrome和Firefox中根本无法使用。

         <script>
        if ($(window).width() > 768) {
         var openmodal={};
         function handleactiveLinks(activeNav){
            $(".clients").css("opacity",activeNav==="clients"?"100%":"80%");
            $(".services").css("opacity",activeNav==="services"?"100%":"80%");
            $(".work").css("opacity",activeNav==="workNav"?"100%":"80%");
            $(".aboutus").css("opacity",activeNav==="aboutus"?"100%":"80%");
            $(".partners").css("opacity",activeNav==="partners"?"100%":"80%");
            $(".contact").css("opacity",activeNav==="contact"?"100%":"80%");
         }

          function closemodal(){
            console.log("openmodal",openmodal)
              $(openmodal.modal).fadeOut();
              $(openmodal.bg).fadeOut();
            }

         $(function() {
         var newb="";
                  $.scrollify({
                    section : ".panel",scrollbars : false,scrollSpeed: 1400,afterResize:function(){
                            $.scrollify.move('#'+newb);
                    },before:function(b){
                    if(openmodal.modal && openmodal.modal.length>0){closemodal();}
                    newb=b+1;
                    switch(newb){
                    case 2:
                    handleactiveLinks("clients");
                      break;
                    case 3:
                        handleactiveLinks("services");
                        break;
                    case 4:
                        handleactiveLinks("workNav");
                        break;
                    case 5:
                        handleactiveLinks("aboutus");
                        break;
                    case 6:
                        handleactiveLinks("partners");
                          break;
                    case 7:
                        handleactiveLinks("contact");
                         break;
                    default:handleactiveLinks("");
                    }
                   }
                  });
              });

              //navigation links  
            $('.clients').click(function() {
                        $.scrollify.move('#Clients');
                  handleactiveLinks("clients");
            })

              $('.services').click(function() {
                $.scrollify.move('#Services');
             handleactiveLinks("services");
            })

              $('.work').click(function() {
                $.scrollify.move('#Work')
             handleactiveLinks("workNav");
            })
            $('.aboutus').click(function() {
                $.scrollify.move('#About')
                handleactiveLinks("aboutus");
            })

              $('.partners').click(function() {
                $.scrollify.move('#Partners')
                         handleactiveLinks("partners");
            })

              $('.contact').click(function() {
                $.scrollify.move('#Contact')
               handleactiveLinks("contact");
            })



         //growth strategy modal
            $(function() {
          $('.growth').click(function(e) {
            openmodal.modal=".gsmdodal";
            openmodal.bg=".gsbg"
            $('.gsmodal').fadeIn();
            $('.gsbg').css("display",'flex');
            $('.gsbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function(e) {
              $('.gsmodal').fadeOut();
              $('.gsbg').fadeOut();
          });  
          $('.gsbg').click(function() {
              $('.gsmodal').fadeOut();
              $('.gsbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.gsmodal').fadeOut();
                  $('.gsbg').fadeOut();
              }
          });
        });

        //marketing automation
            $(function() {
          $(".marketing").click(function(e) {
            openmodal.modal=".mamodal";
            openmodal.bg=".mabg"
            $('.mamodal').fadeIn();
            $('.mabg').css("display",'flex');
            $('.mabg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.mamodal').fadeOut();
              $('.mabg').fadeOut();
          });  
          $('.mabg').click(function() {
              $('.mamodal').fadeOut();
              $('.mabg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.mamodal').fadeOut();
                  $('.mabg').fadeOut();
              }
          });
        });

        //technology
            $(function() {
          $(".technology").click(function(e) {
              openmodal.modal=".techmodal";
            openmodal.bg=".techbg"
            $('.techmodal').fadeIn();
            $('.techbg').css("display",'flex');
            $('.techbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.techmodal').fadeOut();
              $('.techbg').fadeOut();
          });  
          $('.techbg').click(function() {
              $('.techmodal').fadeOut();
              $('.techbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.techmodal').fadeOut();
                  $('.techbg').fadeOut();
              }
          });
        });

        //brand messaging
            $(function() {
          $(".messaging").click(function(e) {
            openmodal.modal=".bmmodal";
            openmodal.bg=".bmbg"
            $('.bmmodal').fadeIn();
            $('.bmbg').css("display",'flex');
            $('.bmbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.bmmodal').fadeOut();
              $('.bmbg').fadeOut();
          });  
          $('.bmbg').click(function() {
              $('.bmmodal').fadeOut();
              $('.bmbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.bmmodal').fadeOut();
                  $('.bmbg').fadeOut();
              }
          });
        });

        //social media
            $(function() {
          $(".social-media").click(function(e) {
              openmodal.modal=".smmodal";
            openmodal.bg=".smbg"
            $('.smmodal').fadeIn();
            $('.smbg').css("display",'flex');
            $('.smbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.smmodal').fadeOut();
              $('.smbg').fadeOut();
          });  
          $('.smbg').click(function() {
              $('.smmodal').fadeOut();
              $('.smbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.smmodal').fadeOut();
                  $('.smbg').fadeOut();
              }
          });
        });

        //design
            $(function() {
          $(".design").click(function(e) {
           openmodal.modal=".dgmodal";
            openmodal.bg=".dgbg"
            $('.dgmodal').fadeIn();
            $('.dgbg').css("display",'flex');
            $('.dgbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.dgmodal').fadeOut();
              $('.dgbg').fadeOut();
          });  
          $('.dgbg').click(function() {
              $('.dgmodal').fadeOut();
              $('.dgbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.dgmodal').fadeOut();
                  $('.dgbg').fadeOut();
              }
          });
        });

        //seo
            $(function() {
          $(".seo").click(function(e) {
           openmodal.modal=".seomodal";
            openmodal.bg=".seobg"
            $('.seomodal').fadeIn();
            $('.seobg').css("display",'flex');
            $('.seobg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.seomodal').fadeOut();
              $('.seobg').fadeOut();
          });  
          $('.seobg').click(function() {
              $('.seomodal').fadeOut();
              $('.seobg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.seomodal').fadeOut();
                  $('.seobg').fadeOut();
              }
          });
        });

        //advertising
            $(function() {
          $(".advertising").click(function(e) {
            openmodal.modal=".advmodal";
            openmodal.bg=".advbg"
            $('.advmodal').fadeIn();
            $('.advbg').css("display",'flex');
            $('.advbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.advmodal').fadeOut();
              $('.advbg').fadeOut();
          });  
          $('.advbg').click(function() {
              $('.advmodal').fadeOut();
              $('.advbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.advmodal').fadeOut();
                  $('.advbg').fadeOut();
              }
          });
        });

        //analytics
            $(function() {
          $(".analytics").click(function(e) {
            openmodal.modal=".anamodal";
            openmodal.bg=".anabg";
            $('.anamodal').fadeIn();
            $('.anabg').css("display",'flex');
            $('.anabg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.anamodal').fadeOut();
              $('.anabg').fadeOut();
          });  
          $('.anabg').click(function() {
              $('.anamodal').fadeOut();
              $('.anabg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.anamodal').fadeOut();
                  $('.anabg').fadeOut();
              }
          });
        });


        //section-2
        //scale up companies
           $(function() {
          $(".suc").click(function(e) {
            openmodal.modal=".sucmodal";
            openmodal.bg=".sucbg"
            $('.sucmodal').fadeIn();
            $('.sucbg').css("display",'flex');
            $('.sucbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.sucmodal').fadeOut();
              $('.sucbg').fadeOut();
          });  
          $('.sucbg').click(function() {
              $('.sucmodal').fadeOut();
              $('.sucbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.sucmodal').fadeOut();
                  $('.sucbg').fadeOut();
              }
          });
        });


        //vcs/investor
           $(function() {
          $(".startups").click(function(e) {
            openmodal.modal=".vimodal";
            openmodal.bg=".vibg";
            $('.vimodal').fadeIn();
            $('.vibg').css("display",'flex');
            $('.vibg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.vimodal').fadeOut();
              $('.vibg').fadeOut();
          });  
          $('.vibg').click(function() {
              $('.vimodal').fadeOut();
              $('.vibg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.vimodal').fadeOut();
                  $('.vibg').fadeOut();
              }
          });
        });

        //ess
         $(function() {
          $(".ess").click(function(e) {
            openmodal.modal=".essmodal";
            openmodal.bg=".essbg";
            $('.essmodal').fadeIn();
            $('.essbg').css("display",'flex');
            $('.essbg').fadeIn();
            e.stopPropagation();
          });
          $('.close-modal').click(function() {
              $('.essmodal').fadeOut();
              $('.essbg').fadeOut();
          });  
          $('.essbg').click(function() {
              $('.essmodal').fadeOut();
              $('.essbg').fadeOut();
          }); 
          $(document).keydown(function (event) {
              if (event.keyCode == 27) {
                  $('.essmodal').fadeOut();
                  $('.essbg').fadeOut();
              }
          });
        });

        //learn more navigation
        $('#learn-more').click(function(){
            $.scrollify.move('#Services');
          handleactiveLinks("services");
        })

        //logo navigation
        $('#logoLink').click(function(){
            $.scrollify.move('#Home');
          handleactiveLinks("");
        })
        }
         </script>
sacklise 回答:滚动不适用于移动设备(谷歌浏览器和Firefox)

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/2478357.html

大家都在问