我正在尝试创建一个粘贴在顶部的导航标题
窗口/浏览器,直到下一个导航标题(div框)被按下为止
它向上看不见。导航标题的动画
用户向下滚动到.fillwindow
的底部时,淡入。
我创建了一个JS小提琴,以尝试更详细地说明我要实现的目标。在那里,您将能够看到我所遇到的小故障。 http://jsfiddle.net/kntnqqa6/5/
有谁能解释为什么CSS中的'top'属性似乎不影响类.header
的原因?
还在jquery部分的.animate
事件中:.animate({'opacity':'1', 'top':'40'}
,'top':'40'
不起作用?我想是因为上面提到的问题
理想情况下,我的目标是使其无缝。如您所见,它们之间的距离太远了。
任何输入,不胜感激。
最佳答案
顶部CSS属性指定了定位位置的一部分
元素。它对未定位的元素没有影响。
对于绝对定位的元素(具有以下位置的元素:绝对或
位置:固定),它指定上边距之间的距离
元素的边缘及其包含块的顶部边缘。
对于相对定位的元素(具有相对位置的元素),它
指定元素移动到其正常位置以下的量。
资料来源:https://developer.mozilla.org/en-US/docs/Web/CSS/top
我重点介绍了影响代码的部分。 top
属性仅适用于定位(固定,绝对,相对)元素。您没有分配其中之一,因此将div放置为静态。
您可以通过在position: relative
中添加.header
来解决您的问题
关于jquery - 粘性导航-动画并向上推,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/30320713/