链接到 HTML 页面的特定部分
Linking to a specific part of a HTML page
如何在另一个 HTML 站点上为长网页的一部分创建 link?
我的问题是,我有 2 HTML 个页面:index.html?Site=Info
.
当我用 #
制作 "Jump link" 时,它不起作用。有什么想法吗?
如果您链接到的部分添加了片段锚点set.animation以达到效果
,片段锚点应该可以工作
$(document).ready(function(){
$(".anchor").click(function(e){
$('html, body').animate({
scrollTop: $($(this).attr('href')).offset().top
}, 1000);
});
});
#top{background-color:red;}
#middle{background-color:yellow;}
#bottom{background-color:green;}
div.block{height:400px;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="toppage"></div>
<a class="anchor" href="#top">
<div class="arrow-down-light-blue">top</div>
</a>
<a class="anchor" href="#middle">
<div class="arrow-down-light-blue">middle</div>
<a class="anchor" href="#bottom">
<div class="arrow-down-light-blue">bottom</div>
</a>
<div class="block" id="top">The top
<a class="anchor" href="#toppage"> Back to top</a>
</div>
<div class="block" id="middle">The middle
<a class="anchor" href="#toppage"> Back to top</a>
</div>
<div class="block" id="bottom">The bottom
<a class="anchor" href="#toppage"> Back to top</a>
</div>
如何在另一个 HTML 站点上为长网页的一部分创建 link?
我的问题是,我有 2 HTML 个页面:index.html?Site=Info
.
当我用 #
制作 "Jump link" 时,它不起作用。有什么想法吗?
如果您链接到的部分添加了片段锚点set.animation以达到效果
,片段锚点应该可以工作$(document).ready(function(){
$(".anchor").click(function(e){
$('html, body').animate({
scrollTop: $($(this).attr('href')).offset().top
}, 1000);
});
});
#top{background-color:red;}
#middle{background-color:yellow;}
#bottom{background-color:green;}
div.block{height:400px;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="toppage"></div>
<a class="anchor" href="#top">
<div class="arrow-down-light-blue">top</div>
</a>
<a class="anchor" href="#middle">
<div class="arrow-down-light-blue">middle</div>
<a class="anchor" href="#bottom">
<div class="arrow-down-light-blue">bottom</div>
</a>
<div class="block" id="top">The top
<a class="anchor" href="#toppage"> Back to top</a>
</div>
<div class="block" id="middle">The middle
<a class="anchor" href="#toppage"> Back to top</a>
</div>
<div class="block" id="bottom">The bottom
<a class="anchor" href="#toppage"> Back to top</a>
</div>