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

    Link below hidden div not clickable

    alexk77116974

      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,

      Alex

        • 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"});