时间戳

首页 > 解决方案 > 如何捕获 div 的位置，以便在页面重新加载时我可以拥有该位置

javascript - 如何捕获 div 的位置，以便在页面重新加载时我可以拥有该位置

问题描述

我想捕获滚动捕获区域的位置，如下图所示

在此处输入图像描述

以便在页面重新加载任何其他情况下保留状态。

$(function(){

   setInterval(function(){
      window.location.reload();
   },90000);
  
});
.container{
  width:600px;
  height:300px;
 // background:red;
  overflow-y:auto;
  font-size:18px;
  line-height: 40px;
  padding-left: 14px;
  position: relative;
}

.center-band{
    position: fixed;
    z-index: 40;
    width: 100%;
    height: 70px;
    background: #0000003b;
    top: 50%;
    transform: translate(-50%, -50%);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  Lorem ipsum, dolor sit amet consectetur adipisicing elit. Adipisci sequi omnis officia, tempore nesciunt distinctio in inventore quia voluptate ducimus eius natus ex. Facilis excepturi distinctio sunt placeat deleniti error.
  
  Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum iste architecto dolores tempora officia vero, repellendus ab voluptas, eveniet dolore, cumque aliquam cum quas facilis aspernatur molestias perferendis eum nesciunt!
  
  
  
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Eligendi fugiat impedit quam, sit, sapiente, provident praesentium beatae non nostrum optio repellendus porro laboriosam quidem ipsa itaque? Voluptatem quam pariatur dolorem.
  
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Error, quisquam similique distinctio, perferendis accusantium quidem voluptatum architecto nulla ad adipisci provident possimus voluptatem ut animi aliquid quo hic ab. Assumenda?
  
  
  
  
  Lorem ipsum dolor sit amet consectetur, adipisicing elit. Fuga, sit corporis. Vitae facilis nesciunt alias consectetur rem, exercitationem, est possimus, beatae architecto suscipit expedita provident culpa. At eum sequi omnis
  
  Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas cum quaerat numquam ex vero, neque aliquid totam, explicabo error suscipit eius. Earum beatae voluptatum cupiditate iusto saepe quidem deserunt magnam?
  
  
  Lorem ipsum dolor, sit amet consectetur adipisicing elit. Commodi possimus excepturi dolores quasi, qui libero quia amet, ab facere quis nulla voluptatem, sunt necessitatibus! Animi voluptates quam minus odio excepturi!
  
  <div class="center-band"></div>
</div>

下面是我的代码笔：

https://codepen.io/eabangalore/pen/jeKQwd/

问题：我正在尝试捕获position乐队区域，以便在页面重新加载时我的文本将相同

请帮助我，提前谢谢

标签： javascriptjquery

解决方案

利用：

老着迷的方式

作为一个文档，最好创建一个章节和标题的文档结构。每个部分都可能有一个 ID。因此，您可以使用锚点创建指向特定页面部分的 URL。您也可以使用锚点创建内部导航。查看更多：https ://developer.mozilla.org/en-US/docs/Web/HTML/Element/a

<a href="#my-section-1">My section 1</a>
<a href="#my-section-2">My section 2</a>
<section id="my-section-1">
  <h2>My section 1</h2>
  <p>Lorem ipsum ...<p>
</section>
<section id="my-section-2">
  <h2>My section 2</h2>
  <p>Lorem ipsum ...<p>
</section>

推荐阅读