Construx

This works on a desktop web browser. It doesn't work on iOS safari. I attached a copy of it as I have not posted it yet. link.html

If I take the link out of the two DIV statements (row and column) the link works.

I have links behind DIV statements that won't work on iOS. I have been researching this problem and others have solved it by fixing the images from overflowing or z-index. No picture goes over another and z-index just made the picture disappear. Any help would be appreciated! <style> .column { float: left; width: 20%; padding: 5px; } /* Clearfix (clear floats) */ .row::after { content: ""; clear: both; display: table; } </style> <div class="row"> <div class="column"> <a href="https://www.google.com"> <img src="Graphics/imdb.png" alt="IMDB"/></a> </div> </div>

What process does everyone use to create an image map for touch on mobile phones? Or does anyone know any good resources for this? I'm using a script to resize the image map to the size of the phone. Unsure if the code I'm using the resize is working. This is what I have: <script src="jquery.min.js"></script> <script src="jquery.rwdImageMaps.min.js"></script> <style> $(document).ready(function(e) { $('img[usemap]').rwdImageMaps(); $('area').on('click', function() { alert($(this).attr('alt') + ' clicked'); }); }); @media only screen and (max-width:620px) { /* For mobile phones: */ .menu, .main, .right { width:100%; } } </style> </head> <div><img src="editbay_mobile.jpg" style="width:100%;" usemap=“#avid”> <map name=“avid”> <area shape=“rect” coords=“150,290,510,290,150,390,510,390” href=“www.google.com” /> <area shape=“rect” coords=“150,410,550,410,150,510,550,510” href=“www.google.com” /> </map> </div>