Levels ReadyTheme Sticky Header

[lesliekirk]

What is this commented out code meant to do? I would like to have a sticky header in Levels but it would appear that uncommenting this code doesn't do it:

<div id="js-sticky-header" class="sticky-header">
        <div class="wrap">
            <div class="row">
                <div id="js-sticky-dropdown-button" class="large-one-twelfth column">
                    <div class="button"></div>
                    <div class="dropdown-menu-sticky-wrap"></div>
                </div>
                <div id="js-sticky-logo" class="column large-three-twelfths"></div>
                <div id="js-sticky-search" class="column large- five-twelfths">
                    <form action="&mvte:urls:SRCH:rr;" method="get" class="search-form">
                        <div class="input-group">
                            <input type="search" name="Search" value="&mvte:global:Search;" placeholder="Search our entire store&hellip;" class="column five-sixths bg-transparent input input-large search-input js-autocomplete-input" data-api-url="&mvte:urls:API:rr;">
                            <button type="submit" class="button button-large column one-sixths bg-transparent search-button" data-icon="&#x55;"></button>
                        </div>
                        <div class="js-autocomplete-results autocomplete-results"></div>
                    </form>
                </div>
                <div id="js-sticky-cart">
                    <a href="&mvte:urls:BASK:auto;" rel="nofollow" id="js-mini-basket" class="mini-basket">
                        <span class="mini-basket-icon" data-icon="&#xe07a;" title="Cart"></span>
                        <span class="mini-basket-inner">
                            <span class="mini-basket-count inline-block" id="js-mini-basket-count">&mvte:global_minibasket:basket_count;</span>
                            <span class="mini-basket-text large-inline-block hide">My Cart <span data-icon="&#x43;" class="mini-basket-down-arrow"></span></span>
                        </span>
                    </a>
                </div>
            </div>
        </div>
    </div>

[Matt Zimmermann]

Hi Leslie,

In Levels, the sticky header was included...although disabled. I believe, to enable it, you would remove the comments from the code you found and remove the comment in scripts.js around line 110 for 'stickyHeader();'.

[lesliekirk]

Hi Leslie,

In Levels, the sticky header was included...although disabled. I believe, to enable it, you would remove the comments from the code you found and remove the comment in scripts.js around line 110 for 'stickyHeader();'.

Ahhhhh, so there is a part two. I'll look for the code in the scripts.js file. Just removing the comments around the code I posted didn't do the trick.

[lesliekirk]

Okie dokie, that got it. Now I have a starting point.

[William Davis]

Okie dokie, that got it. Now I have a starting point.

Leslie, did you ever get this to work and if so, could you please send me link to site?

[lesliekirk]

Leslie, did you ever get this to work and if so, could you please send me link to site?

I did, BUT I do not like the results. For customers using smaller screen sizes (smaller laptops), the drop down menu "sticks" and you cannot see the entire menu. There is no scroll.

It's a dev site behind a wall, so I'll PM you.