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

Hi I'm trying to set 'display:none' on one of my elements because when it gets to the bottom it covers a button. It needs to show then display:none. Is there a way to this?

At the moment i have:-

            <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>

With this display none at 1699p the whole div displays none from the start.

Solution

You can control the "display" easily enough using skrollr. Your code could look something like this:

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