Div Blockieren Klicken auf Links unten

Question

habe ich eine Seite auf Stift https://codepen.io/nenadmail/pen/KmRbGO

Die Navigationsleiste am oberen Rand versteckt, wenn Sie nach unten scrollen, dann blendet, wie Sie wieder nach oben scrollen. Wenn Sie in der Navigationsleiste nach oben blättern, können Sie jedoch unter der Navigationsleiste nicht auf die Links klicken. Wie kann ich die Links unter der Kopfzeile der Navigationsleiste anklickbar machen?

Danke!

<header class="header" role="banner"> 
    <div class="maintop"> 
     <nav> 
      <ul> 
       <li><a href="#services">Services</a></li> 
       <li><a href="#clients">Clients</a></li> 
       <li><a href="#about">About</a></li> 
       <li><a href="#contact">Contact</a></li> 
      </ul> 
     </nav> 
    </div> 
    <div class="maintopL"> 
     <a href="#home"> 
      <h1 id="mainlogo">N2 Mixology</h1> 

     </a> 
    </div> 
</header> 

<p>Lorem Ipsum is simply dummy text of the printing and typesetting 
industry. Lorem Ipsum has been the industry's standard dummy text ever 
since the 1500s, when an unknown printer took a galley of type and 
scrambled it to make a type specimen book. It has survived not only 
five centuries, but also the leap into electronic typesetting, rem 
aining essentially unchanged. <a href ="#">I want this link to work 
even when it is near the nav bar</a>It was popularised in the 1960s 
with the release of Letraset sheets containing. </p> 
<p> Lorem Ipsum passages, and more recently with desktop publishing 
software like Aldus PageMaker including versions of Lorem Ipsum.Lorem 
Ipsum is simply dummy text of the printing and typesetting industry. 
Lorem Ipsum has been the industry's standard dummy text ever since the 
1500s, when an unknown printer took a galley of type and scrambled it 
to make a type specimen book. It has survived not only five centuries, 
but also the leap into electronic typesetting, remaining essentially 
unchanged. It was popularised in the 1960s with the release of Letraset 
sheets containing. </p> 
<p>Lorem Ipsum passages, <a href ="#">I want this link to work even 
when it is near the nav bar</a>and more recently with desktop 
publishing software like Aldus PageMaker including versions of Lorem 
Ipsum.Lorem Ipsum is simply dummy text of the printing and typesetting 
industry. Lorem Ipsum has been the industry's standard dummy text ever 
since the 1500s, <a href ="#">I want this link to work even when it is 
near the nav bar</a>when an unknown printer took a galley of type and 
scrambled it to make a type specimen book. It has survived not only 
five centuries, but also the leap into electronic typesetting, 
remaining essentially unchanged.</p> 

Answer 1

Sie müssen in der Lage sein, die div durch klicken Sie mit pointer-events: none; sicherzustellen, dass dies in CSS tun können, um die Zeiger-Ereignisse zurück zu den navbar Artikel hinzufügen Sie möchten auf klicken:

header { 
    pointer-events: none; 
} 
header div { 
    pointer-events: all !important; 
} 

https://codepen.io/alessi42/pen/JNeBer

Hoffe, das hilft!