簡體   English   中英

平滑滾動到特定的Div

[英]Smooth scroll to specific Div

我有一個鏈接,嘗試使其平滑滾動,它可以工作,但它使所有鏈接都處於活動狀態,我只希望該特定鏈接具有其他功能

<a href="#shelf"></a>

<div id="shelf">content</div>


$(document).ready(function () {
    // Add smooth scrolling to all links
    $("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
            var 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 () {

                // Add hash (#) to URL when done scrolling (default click behavior)
                window.location.hash = hash;
            });
        } // End if
    });
});

然后在您的jQuery選擇器中更具體地更改:

<a href="#shelf"></a>

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

對於:

<a href="#shelf" id="myspecificlink"></a>

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

更改

$("a").on("click", function(){ ... });

$("a#toshelf").on("click", function(){ ... }); 

並將其作為您的HTML

<a href="#shelf" id="toshelf">Click me!</a>

代替使用標簽選擇器,請使用id選擇器,如下所示:

<a id="a1" href="#shelf"></a>

<div id="shelf">content</div>


$(document).ready(function ()
{      
   $("#a1").on('click', function (event)
    {
      //Your code here        
    });
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM