目前我有一个静态标题,现在它是静态的。我正在使用这个js(在CSS-Tricks上找到):
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
|| location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
// Set Scroll Speed Below
}, 800);
return false;
}
}
});
});
如果链接包含href,它基本上是基于滚动的。
但是在移动宽度上(使用媒体查询)。我已将标题设置为:
position:static
自:
position:fixed;
top:0;
width:100%;
我问的是标题(这是60px,一个scss变量),切断页面部分的前60px,因为它设置为“top:0;”,无论如何都得到了上面JS的滚动效果,但能够在击中锚之前滚动-60px。
基于HTML文档或特定JS中逗号分隔的id或添加类的列表。
我会注意到,我不想在移动设备上使用减号滚动,因为标题会静态定位在顶部。