运行代码 缩小
汉王
HTML代码
复制 格式化 注释 注释 清空
放大
AخA
 
1
<html>
2
<head>
3
<title>Js文字章节跳转功能的模拟代码</title>
4
</head>
5
<body>
6
<div id="d1" style="position:absolute; left:0px; top:0px;width:200px; height:100px; border:1px solid navy; cursor:pointer;" onclick="document.getElementById('d2').scrollIntoView();">
7
我是1。 点击跳到2。</div>
8
<div id="d2" style="position:absolute; left:0px; top:3000px;width:200px; height:100px; border:1px solid navy; cursor:pointer;" onclick="document.getElementById('d3').scrollIntoView();">
9
我是2。 点击跳到3。</div>
10
<div id="d3" style="position:absolute; left:30000px; top:3000px;width:200px; height:100px; border:1px solid navy; cursor:pointer;" onclick="document.getElementById('d4').scrollIntoView();">
11
我是3。 点击跳到4。</div>
12
<div id="d4" style="position:absolute; left:3000px; top:0px;width:200px; height:100px; border:1px solid navy; cursor:pointer;" onclick="document.getElementById('d1').scrollIntoView();">
13
我是4。 点击跳到1。</div>
14
</body>
15
</html>
CSS代码
复制 格式化 注释 注释 颜色 清空
放大
CSS代码...
x
 
1
JS代码
复制 格式化 注释 注释 清空
放大
JS代码...
xxxxxxxxxx
1
 
1
名称
Js文字章节跳转功能的模拟代码
分类
网站常用
描述
点击某按钮后,会跳转到指定的位置,如果是一篇小说,可引导用户阅读下一章节,或按用户要求跳转,这里用JavaScript模拟实现,只实现了核心功能,还有众多的地方需要慢慢完善的,在这里发出来供大家参考,一起交流。
收藏