javascript - 滚动在移动设备上被锁定-6ren

javascript - 滚动在移动设备上被锁定

转载作者：行者123 更新时间：2023-12-02 22:31:55

当我尝试在移动设备上滚动网站时，我的网站出现问题，有时它会锁定，甚至当您在设备上滑动手指时，网站也无法正常移动。在桌面上滚动效果很好。我试图找到解决方案，但无法找出问题所在。

您可以使用开发人员工具在 375 px 分辨率或移动设备上进行测试 here

Bootstrap 4 模板:Creative Tim 的 NOW UI 套件

我认为问题出在 cookie 脚本上，但是当我通过在 HTML 中注释来禁用它时，问题并没有解决。我尝试注释我的 JS 文件的部分内容，但仍然不起作用。

这是我的 JS 脚本:

    var selectedClass = "";
    $(".filter").click(function () {
        selectedClass = $(this).attr("data-rel");
        $("#gallery").fadeTo(100, 0.1);
        $("#gallery div").not("." + selectedClass).fadeOut().removeClass('animation');
        setTimeout(function () {
            $("." + selectedClass).fadeIn().addClass('animation');
            $("#gallery").fadeTo(300, 1);
        }, 300);
    });
    $( "#scrollDown" ).click(function() {
        $( "html, body" ).animate({
          scrollTop: 600
        }, 600, function() {
          // Animation complete.
        });
      });

      //Gallery Animations
      baguetteBox.run('.grid-gallery', { animation: 'slideIn' }); 

      //Anchor Function

      function scrollToAnchor(aid){
        let aTag = $("a[name='"+ aid +"']");

        $('html,body').animate({scrollTop: aTag.offset().top}, 900);
    }

      //Menu Anchors Animations
    $("#lexuslink").click(function() {
        scrollToAnchor('lexus');
     });

     $("#fiatlink").click(function() {
        scrollToAnchor('fiat');
     });

     $("#merclink").click(function() {
        scrollToAnchor('merc');
     });

     $("#homelink").click(function(){
        $('html, body').animate({scrollTop: 0}, 900)
     });

     $("a").on('click', function(event) {

        // Make sure this.hash has a value before overriding default behavior
        if (this.hash !== "") {
          // Prevent default anchor click behavior
          event.preventDefault();

          // Store hash
          let hash = this.hash;

          // Using jQuery's animate() method to add smooth page scroll
          // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
          $('html, body').animate({
            scrollTop: $(hash).offset().top
          }, 800, function(){
            window.location.hash = hash;
          });
        } 
      });

});

//E-mail Validation Function

$(".test").hide();

function validateForm() {
    const name = document.getElementById('name').value;
    if (name == "") {
        document.querySelector('.status').innerHTML = "Wypełnij wszystkie pola.";
        return false;
    }
    const email = document.getElementById('email').value;
    if (email == "") {
        document.querySelector('.status').innerHTML = "Wpisz swój adres email";
        return false;
    } else {
        const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
        if (!re.test(email)) {
            document.querySelector('.status').innerHTML = "Wpisz poprawny e-mail.";
            return false;
        }
    }
    const subject = document.getElementById('subject').value;
    if (subject == "") {
        document.querySelector('.status').innerHTML = "Wpisz temat wiadomości.";
        return false;
    }
    const message = document.getElementById('message').value;
    if (message == "") {
        document.querySelector('.status').innerHTML = "Message cannot be empty";
        return false;
    }
    document.querySelector('.status').innerHTML = "Wysyłanie...";
    document.getElementById('contact-form').submit();
}

这是我的 HTML 文件:

<!DOCTYPE html>
<html lang="pl">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="keywords" content="samochody,do,ślubu,wynajem,lexus,fiat,zabytkowe,klasyczne,mercedes,fiat">
    <meta name="author" content="Daniel Mydlarz">
    <title>Samochody do ślubu - Oświęcim i okolice</title>
    <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="assets/css/now-ui-kit.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="sass/baguetteBox.min.css">
    <link rel="stylesheet" type="text/css" href="sass/style.css">
    <link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
    <link rel="manifest" href="/site.webmanifest">
    <link href="https://fonts.googleapis.com/css?family=Mansalva|Princess+Sofia&display=swap&subset=latin-ext"
        rel="stylesheet">
    <link rel="stylesheet" type="text/css"
        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="code.js"></script>
</head>

<body class="landing-page sidebar-collapse">

    <nav class="navbar navbar-expand-lg bg-primary fixed-top navbar-transparent" color-on-scroll="300">
        <div class="container">
            <div class="dropdown button-dropdown d-lg-none">
                <a href="#pablo" class="dropdown-toggle" id="navbarDropdown" data-toggle="dropdown">
                    <span class="button-bar"></span>
                    <span class="button-bar"></span>
                    <span class="button-bar"></span>
                </a>
                <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
                    <a class="dropdown-header">MENU</a>
                    <a class="dropdown-item" href="#lexus">Samochody</a>
                    <a class="dropdown-item" href="#galeria">Galeria</a>
                    <a class="dropdown-item" href="#oferta">Oferta</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="#kontakt">Kontakt</a>
                </div>
            </div>

            <div class="navbar-translate">

                <a class="align-baseline nav-link d-lg-none d-xl-none d-md-none float-left" rel="tooltip"
                    title="Zadzwon teraz aby dowiedziec sie wiecej" data-placement="bottom" href="tel:792-877-785"
                    target="_blank">
                    <i class="fa fa-phone" style="font-size:34px;color: white"></i>
                </a>

                <button class="navbar-toggler navbar-toggler" type="button" data-toggle="collapse"
                    data-target="#navigation" aria-controls="navigation-index" aria-expanded="false"
                    aria-label="Toggle navigation">
                    <span class="navbar-toggler-bar top-bar"></span>
                    <span class="navbar-toggler-bar middle-bar"></span>
                    <span class="navbar-toggler-bar bottom-bar"></span>
                </button>
            </div>
            <div class="collapse navbar-collapse fx-start" id="navigation"
                data-nav-image="./assets/img/blurred-image-1.jpg">
                <ul class="navbar-nav">

                    <li class="nav-item">
                        <a href="#" name="home" id="homelink" class="nav-link bleft">HOME</a>
                    </li>

                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" id="dropdownbtn" href="" id="navbarDropdown" role="button"
                            data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            Samochody
                        </a>
                        <div class="dropdown-menu" aria-labelledby="dropdownMenuMenu">
                            <a href="#lexus" class="dropdown-item" id="lexuslink" name="itmlexus"
                                type="button">Lexus</a>
                            <a href="#fiat" class="dropdown-item" id="fiatlink" name="itmfiat" type="button">Fiat</a>
                            <a href="#merc" class="dropdown-item" id="merclink" name="itmmerc"
                                type="button">Mercedes</a>
                        </div>
                    </li>


                    <li class="nav-item">
                        <a href="#galeria" class="nav-link bleft">Galeria</a>
                    </li>

                    <li class="nav-item">
                        <a href="#oferta" class="nav-link bleft">Oferta</a>
                    </li>

                    <li class="nav-item">
                        <a href="#kontakt" class="nav-link bleft last">Kontakt</a>
                    </li>

                    <li class="nav-item position-right10">
                        <a class="nav-link" rel="tooltip" title="Zadzwon teraz aby dowiedziec sie wiecej"
                            data-placement="bottom" href="tel:792-877-785" target="_blank">
                            <i class="fa fa-phone" style="font-size:34px;color: white"></i>
                        </a>
                    </li>

                    <li class="nav-item position-right">
                        <a class="nav-link" rel="tooltip" title="Sprawdź nas na Facebook'u" data-placement="bottom"
                            href="https://www.facebook.com/Samochody-do-Ślubu-Oświęcim-i-okolice-586389625167858"
                            target="_blank">
                            <i class="fa fa-facebook-official" style="font-size:34px;color:white"></i>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- End Navbar -->


    <div class="wrapper">





        <div class="container-fluid p-0" style="overflow:hidden">
            <div class="wrapper">
                <div class="page-header page-header-small">
                    <div class="page-header-image" data-parallax="true"
                        style="background-image: url('img/slub-bg2.jpg')">
                    </div>
                    <div class="content-center welcome-text">
                        <div class="container-fluid landing-text">
                            <h1 class="h1-respononsive h1-title weird-font">Nowoczesne i klasyczne samochody do ślubu
                            </h1>
                            <h3 class="h3-responsive h3-title">Pozwól sobie na odrobinę luksusu...

                            </h3>
                            <i class="fa fa-angle-double-down fa-4x arrow-down pb-2" id="scrollDown"
                                aria-hidden="true"></i>
                        </div>
                    </div>
                </div>

                <main>
                    <section>
                        <a name="lexus"></a>
                        <div class="section pt-2 section-about-us">
                            <div class="container">
                                <div class="row" id="lexus">
                                    <div class="col-md-8 ml-auto mr-auto text-center">
                                        <h2 class="h2-responsive 
                                    font-weight-bold title my-4 border-top border-bottom py-2">
                                            Nowoczesny Lexus</h2>
                                        <div class="container-lexus-photo pb-4">
                                            <img src="./img/bg-2.jpg" alt="Lexus" class="img-fluid">
                                        </div>

                                    </div>
                                </div>

                                <a name="fiat" />
                                <div class="row" id="fiat">
                                    <div class="col-md-8 ml-auto mr-auto text-center">
                                        <h2 class="h2-responsive 
                                        font-weight-bold title my-4 border-top border-bottom py-2">
                                            Zabytkowy Fiat 126p</h2>
                                        <div class="container-lexus-photo pb-4">
                                            <img src="./img/fiat1.jpg" alt="Fiat 126p" class="img-fluid">
                                        </div>

                                    </div>
                                </div>

                                <a name="merc" />
                                <div class="row" id="merc">
                                    <div class="col-md-8 ml-auto mr-auto text-center">
                                        <h2 class="h2-responsive 
                                            font-weight-bold title my-4 border-top border-bottom py-2">
                                            Klasyczny Mercedes</h2>
                                        <div class="container-lexus-photo pb-4">
                                            <img src="./img/merc1.jpg" alt="Mercedes" class="img-fluid">
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>


            </div>
            </section>


            <!-- GALERIA  -->
            <h2 class="h2-responsive font-weight-bold text-center border-top border-bottom py-2" id="galeria">
                Galeria
            </h2>

            <section class="gallery-block grid-gallery">
                <div class="container">
                    <div class="btn-group-ctn">

                        <button type="button" class="btn btn-info filter" data-rel="all">Wszystkie</button>
                        <button type="button" class="btn btn-info filter" data-rel="1">Lexus</button>
                        <button type="button" class="btn btn-info filter" data-rel="3">Mercedes</button>
                        <button type="button" class="btn btn-info filter" data-rel="2">Fiat 126p</button>
                    </div>


                    <div class="row gallery" id="gallery">
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/1.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/1.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/2.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/2.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/3.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/3.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/4.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/4.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/5.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/5.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/6.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/6.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/7.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/7.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 1">
                            <a class="lightbox" href="./img/8.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/8.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 2">
                            <a class="lightbox" href="./img/fiat01.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/fiat01.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 2">
                            <a class="lightbox" href="./img/fiat02.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/fiat02.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 2">
                            <a class="lightbox" href="./img/fiat03.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/fiat03.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 2">
                            <a class="lightbox" href="./img/fiat04.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/fiat04.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 2">
                            <a class="lightbox" href="./img/fiat05.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/fiat05.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 2">
                            <a class="lightbox" href="./img/fiat06.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/fiat06.jpg">
                            </a>
                        </div>


                        <div class="col-md-6 col-lg-4 item all pics animation 3">
                            <a class="lightbox" href="./img/merc2.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/merc2.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 3">
                            <a class="lightbox" href="./img/merc3.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/merc3.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 3">
                            <a class="lightbox" href="./img/merc4.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/merc4.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 3">
                            <a class="lightbox" href="./img/merc5.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/merc5.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 3">
                            <a class="lightbox" href="./img/merc6.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/merc6.jpg">
                            </a>
                        </div>
                        <div class="col-md-6 col-lg-4 item all pics animation 3">
                            <a class="lightbox" href="./img/merc7.jpg">
                                <img class="img-fluid image scale-on-hover" src="./img/merc7.jpg">
                            </a>
                        </div>

                    </div>
                </div>
            </section>




            </main>
        </div>

        <h2 id="oferta" class="h2-responsive font-weight-bold text-center border-top border-bottom py-2 my-5">
            Oferta</h2>

        <section class="pricing py-5">
            <div class="container">

                <div class="row center-offer">
                    <!-- Free Tier -->
                    <div class="col-lg-8">
                        <div class="card mb-5 mb-lg-0">
                            <div class="card-body">
                                <h6 class="card-price text-center"><span class="period">od</span> 399 <span
                                        class="period">zł</span>
                                </h6>


                                <ul class="fa-ul">
                                    <h4 class="text-muted mt-1">Cena zawiera:</h4>
                                    <li>
                                        Wybrany samochód</li>
                                    <li>
                                        Dojazd do domu
                                        Pani młodej oraz Pana młodego</li>
                                    <li>
                                        Dojazd do kościoła
                                        pary młodej
                                    </li>
                                    <li>
                                        Przejazd na
                                        weselną sale
                                    </li>
                                </ul>
                                <a href="#kontakt" class="btn btn-block btn-primary text-uppercase">Zapytaj o
                                    wolne terminy</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>


        <section class="mb-4 pt-5 px-1" id="kontakt">
            <div class="container">

                <!--Section heading-->
                <h2 class="h2-responsive font-weight-bold text-center my-4 border-top border-bottom py-2">
                    Skontaktuj się z nami</h2>
                <!--Section description-->
                <p class="text-center w-responsive mx-auto mb-5">Masz jakieś pytania? Chcesz dobrać indywidualną
                    ofertę?
                </p>

                <div class="row">

                    <!--Grid column-->
                    <div class="col-md-9 mb-md-0 mb-5 contact-form">
                        <form id="contact-form" name="contact-form" action="mail.php" method="POST">

                            <!--Grid row-->
                            <div class="row">

                                <!--Grid column-->
                                <div class="col-md-6">
                                    <div class="md-form mb-0">
                                        <input type="text" id="name" name="name" class="form-control">
                                        <label for="name" class="">Twoje imię</label>
                                    </div>
                                </div>
                                <!--Grid column-->

                                <!--Grid column-->
                                <div class="col-md-6">
                                    <div class="md-form mb-0">
                                        <input type="text" id="email" name="email" class="form-control">
                                        <label for="email" class="">Twój e-mail</label>
                                    </div>
                                </div>
                                <!--Grid column-->

                            </div>
                            <!--Grid row-->

                            <!--Grid row-->
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="md-form mb-0">
                                        <input type="text" id="subject" name="subject" class="form-control">
                                        <label for="subject" class="">Temat</label>
                                    </div>
                                </div>
                            </div>
                            <!--Grid row-->

                            <!--Grid row-->
                            <div class="row">

                                <!--Grid column-->
                                <div class="col-md-12">

                                    <div class="md-form">
                                        <textarea type="text" id="message"
                                            placeholder="Witam, interesuję mnie wynajem samochodu w terminie ..."
                                            name="message" rows="2" class="form-control md-textarea"></textarea>
                                        <label for="message">Twoja wiadomość</label>
                                    </div>

                                </div>
                            </div>
                            <!--Grid row-->

                        </form>

                        <div class="text-center text-md-left">
                            <a class="btn btn-submit" onclick="validateForm()">Wyślij</a>
                        </div>
                        <div class="status"></div>
                    </div>
                    <!--Grid column-->

                    <!--Grid column-->
                    <div class="col-md-3 text-center kontakt-info">
                        <ul class="list-unstyled mb-0">

                            <li>
                                <i class="fa fa-map-marker fa-2x" aria-hidden="true"></i>
                                <p>32-600 Oświęcim, <br>
                                    ul. Zagrodowa 31B</p>
                            </li>

                            <li><i class="fa fa-phone mt-4 fa-2x" style="color: black"></i>
                                <p>+48 792-877-785</p>
                            </li>

                            <li>
                                <i class="fa fa-envelope mt-4 fa-2x" aria-hidden="true" style="color: black"></i>
                                <p>kodiaqrentacar@gmail.com</p>
                            </li>
                        </ul>
                    </div>
                    <!--Grid column-->

                </div>
            </div>

        </section>
    </div>

    <!-- Plugins -->
    <script type="text/javascript"
        src="https://cdn.jsdelivr.net/npm/cookie-bar/cookiebar-latest.min.js?theme=white&always=1"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.11.0/baguetteBox.js" async></script>

    <!--   Core JS Files   -->

    <script src="assets/js/core/jquery.min.js" type="text/javascript"></script>
    <script src="assets/js/core/popper.min.js" type="text/javascript"></script>
    <script src="assets/js/core/bootstrap.min.js" type="text/javascript"></script>
    <script type="text/javascript"
        src="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/4.7.6/js/mdb.min.js"></script>


    <!--  Plugin for Switches, full documentation here: http://www.jque.re/plugins/version3/bootstrap.switch/ -->
    <script src="assets/js/plugins/bootstrap-switch.js"></script>

    <!--  Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->

    <script src="assets\js\plugins/nouislider.min.js" type="text/javascript"></script>

    <!--  Plugin for the DatePicker, full documentation here: https://github.com/uxsolutions/bootstrap-datepicker -->
    <script src="assets/js/plugins/bootstrap-datepicker.js" type="text/javascript"></script>

    <!--  Google Maps Plugin    -->
    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>

    <!-- Control Center for Now Ui Kit: parallax effects, scripts for the example pages etc -->
    <script src="assets/js/now-ui-kit.js?v=1.3.0" type="text/javascript"></script>

</body>

</html>

也许有人也遇到过类似的问题，希望看到你们的一些建议。如果您需要另一个脚本，请告诉我，希望我们一起解决这个问题。

最诚挚的问候丹尼尔。

最佳答案

您需要从 css 文件中删除以下 css 代码。

.wrapper {
    overflow-x: hidden;
}

并且还需要更新576px媒体查询中元素#kontakt p的字体大小，现在它是1.1rem需要减少0.9rem。

我希望完成这两个小更改后，您的滚动问题将得到解决。

关于javascript - 滚动在移动设备上被锁定，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58872421/

文章推荐： javascript - 传单:通过点击功能缩放到标记

文章推荐： oracle - Oracle 中的分页和锁定

文章推荐： matlab - 最小化具有大向量变量的函数的最佳方法？

javascript - 阻止 body 滚动，但阻止触摸设备上的任何父 div 滚动
如果附加了 'not-scroll' 类，我希望我的 body 不滚动，否则它应该正常工作。我已经搜索这个问题两天了，但找不到任何适合我的解决方案。我想要的是向 body 添加一个 class，并
iOS Safari - 滚动 iFrame 导致下面的 div 滚动
我发现似乎是 iOS Safari 中的错误(我正在 iOS 8 上进行测试)。当绝对定位的 iFrame 漂浮在一段可滚动内容上方时，滚动 iFrame 也会滚动下面的内容。以下 HTML (ava
javascript - 如何启用 Safari 滚动 SVG(滚动 div 中的对象标签)？
我有以下代码来显示一系列投资组合图片，这些图片以 SVG 格式存储在滚动 div 中: 在 Safari 中滚动使用两根手指或鼠标滚轮当光标位于 SVG 之一上时不起作用。该页
Javascript 滚动
我想用 javascript 做的是: 一旦你向下滚动页面，将#sidebar-box-fixed 的位置从 position: relative; 更改为定位:固定；。改回position:rela
Elasticsearch 滚动
我对 Elasticsearch 的滚动功能有点困惑。在 elasticsearch 中，每当用户在结果集上滚动时，是否可以每次调用搜索 API？来自文档 "search_type" => "scan
Javascript 滚动
我试图做到这一点，以便当我向上或向下滚动页面时，它会运行不同的相应功能。我发现了一个类似的问题here但我已经尝试了他们的答案并且没有运气。注意:此页面没有正常显示的滚动条。没有地方可以滚动。 bo
gtk - 滚动 GtkDrawingArea
(C语言，GTK库) 在我的表单上，我有一个 GtkDrawingArea 小部件，我在上面使用 Cairo 绘制 GdkPixbufs(从文件加载)。我想要完成的是能够在窗口大小保持固定的情况下使用
SwiftUI 滚动/列表滚动事件
最近我一直在尝试创建一个拉到(刷新，加载更多)swiftUI ScrollView !!，灵感来自 https://cocoapods.org/pods/SwiftPullToRefresh 我正在努
jquery - 拖放 + 滚动
我正在开发一个应用程序，其中有两个带有可放置区域的列表和一个带有可拖动项目的侧面菜单。当我滚动屏幕时，项目的位置困惑。我试图在谷歌上寻找一些东西，最后得到了这个问题:jQuery draggabl
iphone - UIWebView 滚动
我在 UIWebView 中加载了一个 HTML 表单，而我的 UIWebView 恰好从 View 的中间开始并扩展。我必须锁定此 webView 不滚动并将其放在 ScrollView 之上以允许
javascript - 每个元素上的淡入淡出 - 滚动
如何在每个元素而不是整个元素上应用淡入淡出(与其高度相比)？ HTML: CSS: * { padding: 0; margin: 0; box-sizing: border
flutter - 滚动 PageView
我想使用带有垂直轴的 PageView 并使用鼠标滚动在页面之间移动，但是当我使用鼠标滚动时页面不滚动...仅页面单击并向上/向下滑动时滚动。有什么办法吗？我想保留属性 pageSnapping:
java - JTextField 滚动
我制作这个程序是为了好玩，但我被卡住了，因为程序在屏幕外运行。如何在不完全更改代码的情况下实现滚动条。 public static void main(String args[]) throws IO
flutter - 滚动 PageView
我想使用带有垂直轴的 PageView 并使用鼠标滚动在页面之间移动，但是当我使用鼠标滚动时页面不滚动...仅页面单击并向上/向下滑动时滚动。有什么办法吗？我想保留属性 pageSnapping:
java - 滚动()和添加()
很难说出这里问的是什么。这个问题是含糊的、模糊的、不完整的、过于宽泛的或修辞性的，无法以目前的形式得到合理的回答。如需帮助澄清此问题以便重新打开它，visit the help center 。已关
jquery - 滚动/跟随侧边栏帮助
使用 jquery 技术从 css-tricks.com 获得滚动/跟随侧边栏，如果您不知道我在说什么，这里是代码: $(function() { var $sidebar = $
Jquery-手机滑动菜单面板+滚动
我是 jQuery Mobile 新手。我需要向我的应用程序添加 Facebook 滑动面板功能。我经历了 sliding menu panel ，它工作正常，但我在菜单面板中的内容超出了窗口大小，
javascript - 如何在js或jQuery中检测ctrl +滚动？
有没有办法在 js 或 jQuery 或任何其他工具中检测 ctrl + 滚动。我正在尝试执行一些动态布局代码，我需要检测不同分辨率下的屏幕宽度，我通过使用 setTimeout() 的计时器实现了这
jquery 滚动 + 可拖动项目
我有一部分html代码:
c# - 滚动 RichTextBox
我想控制 RichTextBox 滚动，但在控件中找不到任何方法来执行此操作。这样做的原因是我希望当鼠标光标位于 RichTextBox 控件上时鼠标滚轮滚动有效(它没有事件焦点:鼠标滚轮事件由表单

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 滚动在移动设备上被锁定