我正在使用这个免费脚本
http://codyhouse.co/gem/css-faq-template/
http://codyhouse.co/demo/faq-template/index.html#payments
该演示与我的网站存在相同的问题,尽管在我的网站上更糟。
如果您使用菜单,一切正常。标题上方有一些空间。
但是如果你访问直接链接http://codyhouse.co/demo/faq-template/index.html#payments不是来自菜单
看起来像这样
如您所见,标题“付款”上方没有空格。
在我的页面上更糟。它从“Can I have..”开始,标题被隐藏。当我直接从链接访问页面时,无法找到我可以在哪里调整它,而不会影响我从菜单访问该部分时的外观。
当用户点击一个部分时
//select a faq section
faqsCategories.on('click', function(event){
event.preventDefault();
var selectedHref = $(this).attr('href'),
target= $(selectedHref);
if( $(window).width() < MqM) {
faqsContainer.scrollTop(0).addClass('slide-in').children('ul').removeClass('selected').end().children(selectedHref).addClass('selected');
closeFaqsContainer.addClass('move-left');
$('body').addClass('overlay');
} else {
$('body,html').animate({ 'scrollTop': target.offset().top - 69}, 200);
}
});
JavaScript 代码:http://codyhouse.co/demo/faq-template/js/main.js
最佳答案
只是一个快速的破解,使用
if(window.location.hash) {
// if url contain '#'
// scroll down a few pixle
}
编辑:
很难在 jsfiddle 中证明这一点,因为它不允许我使用 # 哈希。
var url = 'http://example.com/test.html#hash';
//you can get by using window.location.href
var hash = url.split('#')[1];
// this get the 1st hash variable
if(hash) {
// if hash exist
$('html, body').animate({
scrollTop: "5000px"
}, 0);
// scroll down a little bit
}
关于javascript - 页面从菜单 anchor 滚动到右页,但不是从直接链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31248213/