滚动时隐藏包含内容的顶部图像

Question

我想知道如何实现这个wordpress主题中的效果：http://www.vaexu.com/amada_2/#v-header

我想了解如何在向下滚动时隐藏带有内容的顶部图像div。我不确定它是javascript还是CSS魔术，我很感激你们的任何意见。

干杯， 赫里斯托斯。

Answer 1

包含顶部图片的div包含background-attachment: fixed;，以便滚动时背景图像保持在同一位置。

查看this jsFiddle

Answer 2

这样的东西？

EXAMPLE

您应该使用no-repeat fixed center

为div设置背景

Answer 3

您可以在javascript onscroll事件中执行此操作。将您的回调注册到onscroll事件。

     window.onscroll = funcRef;

您可以通过style.display属性显示/隐藏DIV元素

   divElement.style.display = "none" // To hide DIV
   divElement.style.display = "" // Again to show DIV

这必须在正确的时间有条件地完成（你可以使用其他元素位置）