我的主頁上有這個“div”，希望它在我滾動時隨我移動，順便說一句，我正在為網站使用 react

Question

我的主頁上有這個div並希望它在我滾動時與我一起移動：我嘗試使用 position:sticky; 和位置：固定並添加頂部：600px； 但它沒有移動到頂部它卡在底部

 .linkss { color: #8892b0; font-family: 'NTR', sans-serif; font-size: 25px; right: 10px; top: 680px; padding-right: 30px; position: fixed; } .linkss h3 { margin: 0px; height: 50px; color: #c9c1f5; } .linkss a { border: 0px; display: block; padding: 0px; margin: 0px; font-size: 23px; padding-left: 30px; color: #c9c1f5; height: 30px; width: 110px; }

 <div className="linkss"> <h3>/ Links</h3> <a href="https://www.etsy.com/ca/shop/VanillaUnlimited">/ Etsy Shop </a> <a href="https://www.etsy.com/ca/shop/VanillaUnlimited">/ LinkedIn </a> <a href="https://www.etsy.com/ca/shop/VanillaUnlimited">/ Instagram </a> </div>

Answer 1

您需要在 componentDidMount 中使用 addEventListener，如下所示：

componentDidMount() {
  document.addEventListener('scroll', this.doSomething)
}

doSomething = () => {
  if (window.pageYOffset > 100) {
     // add a new class (with top: 0) to element or change style of element by top = 0
  } else {
    // do something else
  }
}

Answer 2

我認為它被卡在了底部，因為你給了top:680px; 將其減小到較小的值，例如20px 。 並將 position 屬性設置為position:sticky;