记录滚动条位置方法2

最新推荐文章于 2024-04-24 17:12:07 发布
最新推荐文章于 2024-04-24 17:12:07 发布
阅读量117 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/black263/archive/2007/12/21/1009103.html
版权

<!--
Created by 宝玉 , 2004-2-21
http://www.webuc.net
http://www.nwpubbs.net
Description: 记录页面上次的滚动条位置
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 记录滚动条位置 </TITLE>

<script language="javascript">
    <!--
 //  获取当前文件名
 function getFileName()
 {
  var url = this.location.href
  var pos = url.lastIndexOf("/");
  if(pos == -1)
   pos = url.lastIndexOf("\\")
  var filename = url.substr(pos +1)
  return filename;
 }

 function fnLoad()
 {
  with(window.document.body)
  {
   addBehavior ("#default#userData"); // 使得body元素可以支持userdate
   load("scrollState" + getFileName()); // 获取以前保存在userdate中的状态
   scrollLeft = getAttribute("scrollLeft"); // 滚动条左位置
   scrollTop = getAttribute("scrollTop");
  }
 }

 function fnUnload()
 {
  with(window.document.body)
  {
   setAttribute("scrollLeft",scrollLeft);
   setAttribute("scrollTop",scrollTop);
   save("scrollState" + getFileName()); 
   // 防止受其他文件的userdate数据影响，所以将文件名加上了
   // userdate里的数据是不能跨目录访问的
  }
 }
 window.onload = fnLoad;
 window.onunload = fnUnload;

    // -->
</script>
</HEAD>

<BODY>
</BODY>
</HTML>

转载于:https://www.cnblogs.com/black263/archive/2007/12/21/1009103.html

weixin_30394981
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
记录滚动位置
a13706935773的专栏
09-19 1063
h5页面记录滚动位置的步骤思想 第一种情况：页面不分页时候,只是记录滚动位置，记录个滚动缓存就可以了，跳转到滚动位置就可以了。（百度上很多，就不说了。） 第二种情况：页面分页时候，记录滚动位置 这种情况很坑，以下是处理这样的情况的步骤（举例：电商商品首页记录位置） 总要思想步骤： 1.先记录滚动位置和当前商品数据到缓存。 ps:因为跳转时候如果不先渲染出你的页面，这时候你滚动位置如果大...
vue中记录滚动条位置
老余的博客
11-02 5502
但是有个缺点，页面刷新后就不记录了，但是简单高效。在点击的时候记录滚动条位置，存入本地。, 使用缓存机制来记录滚动条位置。再次进入该路由读取滚动跳位置。
记录滚动条位置，passive,scrollTop
weixin_43843679的博客
02-28 752
注意： .passive 将启动被动监听器/ scrollTop 情景： 关于进入父页面滚动条滚动页面，点击进入子页面后返回父页面，要求定位到之前滚动条滚动的位置。 //可以在父类滚动条最外面的div中加上 <div id="flowDetail" style="overflow: auto; height: 100%" @scroll.passive="getScroll"></div> methods: { //步骤一：实时监测位置 getScroll(event) {
vue + vant van-pull-refresh 列表页记录滚动条位置，详情再返回列表页后还原记录的滚动条位置
最新发布
飞猪
04-24 828
vue + vant 列表返回记录滚动条位置
keep-alive记录滚动条位置
陈景夏
04-22 906
在做消息列表时需要记录keep-alive切换页面的滚动条位置。 mounted() { // 监听滚动条的位置 this.$refs.scrollDom.addEventListener( 'scroll', (res) => { const height = res.target this.tableScrollTop = height.scrollTop
vue3 记录页面滚动条的位置，并在切换路由时存储或者取消
lzfengquan的博客
04-01 812
需求，当页面内容超出了浏览器可是屏幕的高度时，页面会出现滚动条。当我们滚动到某个位置时，操作了其他事件或者跳转了路由，再次回来时，希望还在当时滚动的位置。那我们就进行一下操作。利用 @scroll=“handleScroll” 事件进行操, 定义的ref 获取dom。4.路由守卫 beforeRouteLeave路由离开前记录当前的位置。我这里获取的是元素本身的滚动条事件，可不是 window的滚动条事件。注意我们需要给元素的最外层父级元素设置。3.每次进入都要将存储的位置重新赋值给页面。
保存滚动位置的实现方法
qq_39410252的博客
10-01 2122
有的时候从列表页面进入详情页面再返回列表页面，即使使用了keep-alive缓存列表页，也会导致列表页面你的滚动位置发生了变化。两个页面高度不一致导致页面跳转的时候滚动条位置发生了改变；keep-alive不会缓存滚动条的位置。为了解决这个问题我们需要手动的保存列表页面的滚动条位置，并再切换回列表页面的时候滚动到保存的位置。
layui 实现table翻页滚动条位置保持不变的例子
10-16
为了解决这个问题，我们需要在表格重载前记录滚动条的位置，并在数据重新加载后恢复这个位置。 以下是一个具体的解决方案： 1. 首先，我们需要为layui table定义一个外层div，给它一个唯一的id，例如 "table_and_...
vue使用keep-alive保持滚动条位置的实现方法
10-17
主要介绍了vue使用keep-alive保持滚动条位置的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
h5下拉刷新上拉加载滚动条位置
12-21
而滚动条位置的问题则关系到用户体验的连贯性，确保用户在离开页面后再次返回时，能够直接回到之前查看的位置，这是现代Web应用优化的重要部分。 1. **H5页面返回**：在H5页面间进行导航时，用户可能会通过浏览器的...
Vue记住滚动条和实现下拉加载的完美方法
11-19
当我们在开发 web app 的时候，经常会遇到一个问题，就是当从一个可滚动的列表页进入到下一个详情页面，然后返回列表页面的时候，很难去还原滚动条的状态，无法记住进来时候的位置。 以前我尝试过很多方法： 有 vue...
js 实现 记录滚动条位置
03-30
js 实现 记录滚动条位置! 值得下载看看!资源免费,大家分享!!
asp.net通过Ajax UpdatePanel回传后滚动条位置变更解决方法
01-01
1、首先用onscroll事件保存scorll值，并用HiddenField记录scroll值 代码如下: ”lv_content” class=”unify_content” xss=removed xss=removed> </div> ”HiddenFieldScroll” runat=”server”> 代码 //2
vue3.0记录滚动位置的两种方法
Smile_666666的博客
05-20 5260
第一种方法 onActivated+onBeforeRouteLeave 方法实现 import { onBeforeRouteLeave} from 'vue-router' const scrollRef = ref(null) const scrollTop = ref(0) onActivated(()=>{ nextTick(()=>{ scrollRef.value.scrollTop = store.getters.scrollTop }) }) onBefor
vue跳转页面后返回不刷新且记录历史滚动条停留位置 (实现了根据不同页面来设置是否刷新记录的功能)
weixin_44805839的博客
02-20 6395
vue跳转页面后返回不刷新且记录历史滚动条停留位置 (实现了根据不同页面来设置是否刷新记录的功能)
vue单页设置页面不刷新 记录滚动条的位置
恍若c的博客
11-25 1335
功能需求 点击第三级分类节点进入商品列表，然后，点击左上方返回按钮，此时页面重新回到了第一个一级分类节点展开的效果。应该改成，返回到当前的一级分类节点下的三级分类节点 vue单页 使用keep-alive页面返回不刷新 法1：设置所有页面进入分类页时都缓存（已试过成功） 是Vue的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染DOM。 1.在配置router的文件中设置分类页的keepAlive为true 2.将app.vue文件设置为 <template> <div
vue记录滚动条位置
kilito_01的博客
03-28 1477
在要记录滚动条位置的页面的路由，在mate里加上scrolltop：0 这个属性，然后在这个页面中，activeted中，去监听滚动条的方法，window.addevent（“scroll”，this.）
记录浏览器滚动条位置
guo273559625的博客
01-21 3338
1，使用瞄定位,href="#guo",指向name或者id为guo的元素,使用name定位只对a标签有用 2，用原生js方法，name.id.class document.getElementById ("guo"). scrollIntoView() document.getElementsByName ("guo")[0]. scrollIntoView() 3，js定位
android scrollview记录滚动条位置
05-25
你可以使用 `getScrollY()` 方法来获取 `ScrollView` 的垂直滚动位置。当用户滚动 `ScrollView` 时，你可以将该值存储到本地变量中，以便在以后恢复该位置。例如，在 `ScrollView` 的监听器中： ```java scrollView...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值