javascript - CSS Z-Index OVER Javascript "Survey Monkey"PNG 在滚动条底部淡化

Question

希望在我们的调查问卷框的底部添加一个 PNG 淡入淡出。简短的问题不会显示它们，但对于带有垂直滚动的较长问题，我想在底部添加一个轻微的淡入淡出，以帮助指示下面还有更多内容。滚动条应该足以通知人们，但有些人需要更多一点，加上它是“我们”(我的老板和我)想要的。

这是我正在处理的页面: http://www.careersinmusic.com/template.aspx

点击“点击我进行调查”链接加载调查。

问题 #3 更长并且使用卷轴。对问题 #1 和 #2 单击"is"以转到较长的问题 #3。

任何帮助总是非常感谢，希望这是足够的信息。

Answer 1

• 首先，为您的#PageContentDiv 指定一个position 样式(可能是relative)。
• 然后，在那个 div 中包含 PNG 淡入淡出图像，还有一个 position(可能是 absolute)
• 将 z-index:1 赋给 #PageContentDiv，将 z=index:2 赋给推子图像
• 在该推子图像上设置display:none
• Javascript:测试 #PageContentDiv 是否已滚动 (.scrollTop==0)
• Javascript:如果滚动条仍为 0，则显示推子 (.style.display='')

要记住的关键部分是元素需要 position 样式才能应用 z-index，并且一旦用户有，您就需要移除推子意识到盒子可以滚动。