Question

我想知道JQuery中是否还有滚动到不同div内部的元素。例如，如果我转到example.com/programme#event-2,左边的div应滚动到元素id =“event-2”，右边的div应滚动到元素id =“event-2”。这是我的HTML：

<div id="events">
    <div id="event-list">
        <div class="content">
            <h2>Vendredi 17 octobre</h2>
            <ul id="event-1" class="event-title">
                list items
            </ul>
            <h2>Vendredi 21 octobre</h2>
            <ul id="event-2" class="event-title">
                list-items
            </ul>
        </div>
    </div>

    <div id="event-details">
        <div class="content">
            <section id="event-1" class="details">
                stuff
            </section>

            <section id="event-2" class="details">
                stuff
            </section>
        </div>
    </div>
</div>

您可以查看此Codepen，这有助于查看我的问题。谢谢！

Answer 1

此处是指向示例的链接：CODEPEN

首先重要

Id只能使用一次，你可以像＃event-1等类一样使用它

第二个我为第一列创建按钮，红色“滚动”

$(function(){
  var thisOffset = $("#event-5").offset().top; // get element top offset 


  $(".scroll").on("click", function(e){
    console.log("scroll")
     $("#event-list .content").animate({  //scroll to specific offset on click 
       scrollTop: thisOffset
     }, 1000)
     e.preventDefault();
  });
});

JQuery，滚动到不同div中的元素

1 个答案: