I'm creating following website:
www.melkerhei.be/smeltkroes/index.html
On the desktop version, everything is fine. But when optimizing the mobile version I faced a problem that I can't solve.
Thinks that should work together (on mobile):
- The top left logo should be clickable
- The artists and other elements should be clickable
- The objects (images) at the edges should be on the foreground
So I tried it with and without the pointer-events attribute. (added it to a css class that's only used on mobile and on the img itself) The z-index'es of the edge-images are higher because they need to be on the foreground.
So when I delete the pointer-events:none from the css class, the logo is not clickable. When I add pointer-events:none; to the mobile css class, the logo is clickable but the other elements are not clickable anymore.
