1 Reply Latest reply on Jun 24, 2015 5:21 PM by akouns

    Link below hidden div not clickable


      Hello everyone,


      I have a huge problem with my interactive map, heres a link to my project on Dropbox. The Problem is that I can't click on a link which is below a hidden div which is positioned over it.

      You can try it, the error occurs when you click onto Mexico - left button works as the hidden SVG is not directly over it, the second button is not clickable.


      Whats the best way to display a div after clicking on a link, the div or SVG in my case, has to be on top of the link. At the moment I made the SVG hidden and as soon as you click the link, the SVG gets visible, but as I found out, the SVG is still there and blocks the links below even when the SVG is not visible.


      Thank you guys so much!!!


      edit: or maybe there is a way to de-activate a symbol or <div>, so its totally inactive and if need kind of re-activated it and the links get visible again... kinda hard to describe



      best regards, from Germany,


        • 1. Re: Link below hidden div not clickable
          akouns Level 1

          Apply this piece of code to the item on top either at compositionReady or at the point where you want to be able to click under it:


          sym.$("nameOfItem").css({"pointer-events": "none"});


          Or if the item on top is a symbol:


          sym.getSymbol("nameOfSymbol").css({"pointer-events": "none"});


          you can also toggle the click ability of the top item back to on:


          sym.getSymbol("nameOfSymbol").css({"pointer-events": "auto"});