wordpress sticky menü blättern problem - browser window size?

Question

Ich versuche, ein Problem zu beheben, das mit dem Wordpress Sticky-Menüproblem zusammenhängt. Auf dieser Seite wird das Problem angezeigt: http://kitchpickleball.com/product-category/usopencollection/performance-ss-crews-usopencollection/

In Chrome und mit dem Mausrad nach unten scrollen, zeigt diese Seite verschiedene Verhaltenstypen basierend auf der Größe des Browserfensters.

a) Wenn das Browserfenster so groß ist (vertikal), dass nur eine Reihe von Produkten sichtbar ist, ist das Verhalten wie erwartet. Die Seite wird den ganzen Weg zur Fußzeile durchlaufen, und das klebrige Menü wird angezeigt.

b) Wenn das Browserfenster so groß ist, dass beide Produktreihen kaum sichtbar sind, blinkt der Inhalt bevor ich zur Fußzeile gehe. (Und manchmal, ich bin nicht einmal in der Lage in die Fußzeile.) Das klebrige Menü an der Spitze wird nie sichtbar.

Ich habe eine Reihe von vorgeschlagenen Lösungen für das Problem gesehen (vorausgesetzt, das Problem ist ein Sticky-Menü-Problem), aber habe sie nicht alle vollständig verstanden. Ich bin ziemlich versiert in CSS, aber nicht so sehr in JS. Eine Lösung, die ich verstanden habe, war, den Header und den Sticky Header auf die gleiche Größe zu bringen, aber das hat das Problem in meinem Fall nicht gelöst. Ich hoffe, dass jemand da draußen mir helfen kann. Würde sehr geschätzt werden!

Answer 1

Überschreiben Sie dieses CSS und versuchen Sie es.

 #masthead.stuck { 
     top: 0px !important; 
     left: 0; 
     right: 0; 
     z-index: 100; 
     box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2); 
    }