Skrollr

Question

您好，我正在尝试在我的一个元素上设置 'display:none'，因为当它到达底部时它会覆盖一个按钮。然后需要显示 display:none。有办法吗？

目前我有：-

            <header
                data-start="opacity: 1; "
                data-400p-start="opacity: 1; "
                data-450p-start="opacity: 0; "
                data-1699p-start="display: none;"
            >
                <div class="wrapper clearfix">

                    <div class="intro">
                        <h1><span>Innovative Studios Tailor Made</span>
                        <span>For Your Natural Habitat</span></h1>
                        <a href="contact.html" class="intro_btn">GET A FREE CONSULTATION</a>
                    </div>

                </div>
            </header>

使用此显示 none 1699p，整个 div 从一开始就显示 none。

Answer 1

skrollr 旨在为不透明度等 css 变化设置动画。但是，当您列出 "display:none" 时，此动画没有开始点。如果您的元素覆盖了一个按钮，使用 skrollr 来解决这个问题并不理想。您可以使用 css 来解决这个问题（例如使用 z-index 标签）。

Answer 2

您可以使用 skrollr 轻松控制 "display"。您的代码可能如下所示：

 <header
            data-start="opacity: 1; display:block;"
            data-400p-start="opacity: 1; "
            data-450p-start="opacity: 0; "
            data-1699p-start="display: none;"
        >

Skrollr - 如何在滚动条上制作 div display:none

Skrollr - how to make a div display:none on scroll

html

css

parallax