clip eine feste div von einem scrollenden div unter

Question

Ich habe eine feste Kopfzeile, die ich nur zeigen wollen, wenn es auf einem bestimmten Bild ist.

Wenn der Benutzer scrollt möchte ich das der festen Header

 <Header 
     position=fixed 
     clip-path=url(#clip-stage.id)> Fixed Header RED 
     </Header> 
     <Slide 
     position=absolute 
     > 
     <svg 
     position=absolute 
     > 
     <defs> 
      <clipPath id=clip-stage.id}> 
       <rect 
       x=0 y=0 height=100% width=100% 
       /> 
      </clipPath> 
     </defs> 
     </svg> 
    </Slide> 

** hinzugefügt Pseudo-CSS-Code als Referenz **

---

zu verstecken, wie das Bild scrollt darunter beginnen Ich habe versucht, einen ClipPath um jedes Hintergrundbild herum zu erstellen, was für mich nicht funktioniert hat und ich glaube, dass möglicherweise ein Überlauftrick funktioniert.

Answer 1

Ich würde vorschlagen, Bootstrap zu verwenden und eine schnelle navbar zu bauen. Sie könnten einfach JS schreiben oder kopieren und einfügen, die die Navigationsleiste beim Scrollen verbergen würde.

Die CSS hierfür wäre:

display:none; 

Der Punkt ist Bootstrap all dies und mehr macht sehr einfach!