Question

我对此user提出了一个非常类似的问题，但无法解决我的问题。

我还提到了Chris Coyier's tutorial并使用了他的：在伪元素方法之前。但是，我无法让<section>元素的顶部反映出与:before孩子相同的顶部。

以下是一些示例代码：

HTML

<section id="about">

CSS

#about:before { 
display: block; 
content: " "; 
margin-top: -180px; 
height: 180px; 
visibility: hidden; 
}

这是the website我正在努力，所以你可以现场检查。

我想要这样做的原因是因为我的导航栏是固定的，每当点击来自中殿栏的哈希标签链接时，它几乎切断了部分标题。我只想偏移滚动的停止点，在标题和导航栏之间添加更多的填充。

提前致谢!!

Answer 1

您的section元素上的padding-top似乎是造成问题的原因。如果你移除填充它将起作用，但是，你需要修复所有间距。

我认为你最容易做的就是抵消你的滚动功能......在agency.js中，在第12行- 70之后添加scrollTop: $($anchor.attr('href')).offset().top：

// jQuery for page scrolling feature - requires jQuery Easing plugin
$(function() {
    $('a.page-scroll').bind('click', function(event) {
        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top -70
        }, 1500, 'easeInOutExpo');
        event.preventDefault();
    });
});

：在伪元素与父元素分开执行之前

1 个答案: