2017-09-05 4 views
2

Ich verwende ein Prestashop Premium-Thema, das ein Sticky-Menü auf Scroll hat. Zusätzlich zu diesem Menü habe ich ein weiteres Modul für ein Menü hinzugefügt, das nicht klebrig ist. Ich versuche, dieses zweite Menü, das ich hinzugefügt habe, um klebrig zu machen, aber ich bin mir nicht sicher, wie. Ich habe Screenshots angehängt, um Ihnen zu zeigen, was ich meine. Das erste Bild zeigt beide Menüs und das zweite Bild zeigt das Menü an, das gerade klebrig ist. Also, ich möchte beide auf Scroll-Sticky sein.Sticky Top-Menü in Prestashop

Voll Menü:

enter image description here

Aktuelle sticky Menü enter image description here

benutzte ich dieses Modul das Hauptmenü hinzufügen, die nicht klebrig ist:

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

Wie kann ich Dieses Menü ist klebrig? Danke vielmals.

+0

haben Sie versucht, mit 'position: fixed;' auf dem Menü, das nicht klebrig ist? –

+0

Ja, das habe ich ausprobiert, aber die anderen Menüs bleiben oben, wenn ich auf der Seite blättere. Also auch wenn ich versuche es zu beheben ist immer noch unter dem anderen Menü. –

+0

Ist das das erwartete Ergebnis? https://jsfiddle.net/rezyc4bt/ –

Antwort

1

Sie müssen 2 Dateien bearbeiten:

/themes/ps_glori/css/global.css

Linie 2469, in der #header > .nav ändern: position: relative mit position: fixed und fügen: width: 100%

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

Linie 72, in der .cs-sticky-fixed, ändern top: 0 mit top: 30px.

+0

Das hat funktioniert. Danke vielmals! :) –