Make certain elements clickable

Hello everyone I have the following code:
https://codepen.io/NoeFalque/pen/LjPPbm

It is a simple carousel you can swipe every screen from left to right literally grabbing each screen. The problem is you can’t click on anything, the “grab” property doesn’t allow you to, for example, click on an < a HREF="" > link.

I thought I could solve this problem with the z-index css property but it didn’t work. I’m pretty sure there must be a simple way to solve it modifying the JavaScript code but I’m crap at it and can’t get it right.

I would appreciate any help. Thanks in advance and sorry for my English!

i cant access your code as it is onion so i cant be much help, but have you tried wrapping your <a> tag around the other element

Here is the link sorry: https://codepen.io/NoeFalque/pen/LjPPbm

//link 
  <li class="slide">
      <a class="link" href="http://www.google.com" target="_blank">link</a>
      <div class="parallax"><p>Hello you ! 🌐</p></div>
    </li>

//css 

.link {
  position:absolute;
  padding:20px;
  font-size:40px;
  top:50px;
}

this seems to work just change the position with left and right and stuff, hope this helps :slightly_smiling_face: