prestashop 中的粘性顶部菜单

Question

我使用的是 prestashop premium 主题，它在滚动条上有一个粘性菜单。在此菜单之上，我为非粘性菜单添加了另一个模块。我正在尝试使我添加的第二个菜单具有粘性，但我不确定如何。我附上截图来告诉你我的意思。第一张图片显示了两个菜单，第二张图片显示了现在处于粘性状态的菜单。所以，我希望两者都粘在滚动上。

完整菜单：

当前的置顶菜单

我用这个模块添加了非粘性的顶部菜单：

{if $MENU != ''}
    <!-- Menu -->
    <div id="block_top_menu" class="sf-contener clearfix col-lg-12">
        <div class="cat-title">{l s="Categories" mod="blocktopmenu"}</div>
        <ul class="sf-menu clearfix menu-content">
            {$MENU}
            {if $MENU_SEARCH}
                <li class="sf-search noBack" style="float:right">
                    <form id="searchbox" action="{$link->getPageLink('search')|escape:'html':'UTF-8'}" method="get">
                        <p>
                            <input type="hidden" name="controller" value="search" />
                            <input type="hidden" value="position" name="orderby"/>
                            <input type="hidden" value="desc" name="orderway"/>
                            <input type="text" name="search_query" value="{if isset($smarty.get.search_query)}{$smarty.get.search_query|escape:'html':'UTF-8'}{/if}" />
                        </p>
                    </form>
                </li>
            {/if}
        </ul>
    </div>
    <!--/ Menu -->
{/if}

如何使这个菜单具有粘性？非常感谢。

Answer 1

您需要编辑 2 个文件：

/themes/ps_glori/css/global.css

第 2469 行，在 #header > .nav 中，将：position: relative 更改为 position: fixed 并添加：width: 100%

/themes/ps_glori/css/modules/csmanagement/css/codespot-global.css

第 72 行，在 .cs-sticky-fixed 中，将 top: 0 更改为 top: 30px。

prestashop 中的粘性顶部菜单

Sticky top menu in prestashop

css

jquery

prestashop

prestashop-1.6