如何在 scrollspy 上设置停止位置
How to set stop position on scrollspy
我在我的项目中使用 bootstrap scrollspy,基本上我点击这里 link 它具有以下 url 格式 http://example.com/#positionA 并且在页面上它加载我有以下 html 代码
<p></p>
<h3 id="positionA">Position A</h3>
<p>This is a test code</p>
我遇到的问题是页面加载到我想要的位置但滚动停止在
这是一个测试代码
位置而不是位置 A。
如何修复 scrollspy 停止的位置,以便在段落标题之前停止并同时显示标题?谢谢
[更新]
该项目是一个 prestashop 网站,我正在研究该网站的条款和条件。所以在交付页面上我有点击这里如果客户点击它会把他带到特定部分的条款和条件页面。 body 我有这个
<body id="cms" class="cms cms-3 cms-terms-and-conditions-of-use hide-right-column lang_en two-columns" data-spy="scroll" data-offset="50">
所有的文字都属于这个div
<div id="center_column" class="center_column col-xs-12 col-sm-9">
<div class="rte">
</div>
</div>
所以在交付页面上我有以下代码
<li>Terms and conditions for delivery, refund and returns please <a href="http://examople.com/content/3-terms-and-conditions-of-use#refunds_returns">click here</a></li>
使用Scrollspy偏移量
通过添加
data-offset="10"
到
<a data-spy="scroll" data-target="#positionA" data-offset="20" href="#positionA" >
它将 'offset from top when calculating position of scroll' 像素
我找到了解决方案,这是我的代码,我是如何修复它的
var hash = false;
if(window.location.hash) {
hash = true;
}
if (hash)
{
hash = document.URL.substr(document.URL.indexOf('#')+1);
var anchor = $('#'+hash).offset();
console.log("left" + anchor.top);
anchor.top = anchor.top - 100;
console.log("top" + anchor.top);
$('html, body').animate({
scrollTop: anchor.top
}, 500);
}
我在我的项目中使用 bootstrap scrollspy,基本上我点击这里 link 它具有以下 url 格式 http://example.com/#positionA 并且在页面上它加载我有以下 html 代码
<p></p>
<h3 id="positionA">Position A</h3>
<p>This is a test code</p>
我遇到的问题是页面加载到我想要的位置但滚动停止在
这是一个测试代码
位置而不是位置 A。如何修复 scrollspy 停止的位置,以便在段落标题之前停止并同时显示标题?谢谢
[更新] 该项目是一个 prestashop 网站,我正在研究该网站的条款和条件。所以在交付页面上我有点击这里如果客户点击它会把他带到特定部分的条款和条件页面。 body 我有这个
<body id="cms" class="cms cms-3 cms-terms-and-conditions-of-use hide-right-column lang_en two-columns" data-spy="scroll" data-offset="50">
所有的文字都属于这个div
<div id="center_column" class="center_column col-xs-12 col-sm-9">
<div class="rte">
</div>
</div>
所以在交付页面上我有以下代码
<li>Terms and conditions for delivery, refund and returns please <a href="http://examople.com/content/3-terms-and-conditions-of-use#refunds_returns">click here</a></li>
使用Scrollspy偏移量
通过添加
data-offset="10"
到
<a data-spy="scroll" data-target="#positionA" data-offset="20" href="#positionA" >
它将 'offset from top when calculating position of scroll' 像素
我找到了解决方案,这是我的代码,我是如何修复它的
var hash = false;
if(window.location.hash) {
hash = true;
}
if (hash)
{
hash = document.URL.substr(document.URL.indexOf('#')+1);
var anchor = $('#'+hash).offset();
console.log("left" + anchor.top);
anchor.top = anchor.top - 100;
console.log("top" + anchor.top);
$('html, body').animate({
scrollTop: anchor.top
}, 500);
}