第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使頁面滾動以將 div 放在頂部

使頁面滾動以將 div 放在頂部

浮云間 2023-03-18 16:46:45
我正在構(gòu)建一個頁面,其中有一些具有不同高度的 div 和其中的文本,我想在單擊 div 的文本時移動頁面,以便該 div 位于屏幕頂部.我四處搜索,但我發(fā)現(xiàn)的通常與固定屬性有關(guān),問題是我不想更改 div 的位置屬性,我只想讓頁面自動滾動,這樣 div 就會在上面。你對我可以從哪里開始有什么建議嗎?謝謝.container {  width: 100vw;  height: auto;}.element {  padding: 50px;}#element-1 {  background-color: beige;  height: 500px;}#element-2 {  background-color: darkSeaGreen;  height: 200px;}#element-3 {  background-color: coral;  color:  white;  height: 800px;}#element-4 {  background-color: MidnightBlue;  color: white;  height: 300px;}<div class="container">  <div class="element" id="element-1">    <h1>Some text</h1>  </div>  <div class="element" id="element-2">    <h1>Some text</h1>  </div>  <div class="element" id="element-3">    <h1>Some text</h1>  </div>  <div class="element" id="element-4">    <h1>Some text</h1>  </div></div>
查看完整描述

2 回答

?
人到中年有點甜

TA貢獻1895條經(jīng)驗 獲得超7個贊

如果我正確理解你,這將幫助你。


let divs = document.querySelectorAll(".element");

divs.forEach(div => {

    div.addEventListener("click", event =>{

        let divTop = div.offsetTop;

        window.scrollTo(0, divTop);

        console.log(divTop + " --- " + window.scrollY);

    });

});

.container {

    width: 100vw;

    height: auto;

}

.element {

    padding: 50px;

}

#element-1 {

    background-color: beige;

    height: 500px;

}

#element-2 {

    background-color: darkSeaGreen;

    height: 200px;

}

#element-3 {

    background-color: coral;

    color:  white;

    height: 800px;

}

#element-4 {

    background-color: MidnightBlue;

    color: white;

    height: 300px;

}

<div class="container">

  <div class="element" id="element-1">

    <h1>Some text</h1>

  </div>

  <div class="element" id="element-2">

    <h1>Some text</h1>

  </div>

  <div class="element" id="element-3">

    <h1>Some text</h1>

  </div>

  <div class="element" id="element-4">

    <h1>Some text</h1>

  </div>

</div>


查看完整回答
反對 回復(fù) 2023-03-18
?
UYOU

TA貢獻1878條經(jīng)驗 獲得超4個贊

您需要實現(xiàn)一個執(zhí)行此操作的功能

window.scrollTo(x, 0);

其中 x 是元素的位置。你可以通過使用

let x = element.getBoundingClientRect().top;


查看完整回答
反對 回復(fù) 2023-03-18
  • 2 回答
  • 0 關(guān)注
  • 199 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號