8 Replies Latest reply on May 1, 2015 11:42 PM by lucass24724743

    iFrames inside animation; scroll bars on mobile

    jomariworks

      I have been working on creating an Edge document that has an image of a map with hotlinks. Clicking on the hotlink loads an iframe into an area below the image.  The iframe is set to display scrollbars when content is larger than the iframe window.

       

      This works fine on desktops.

       

      A demonstration of the project is online at http://www.jomariworks.com/edge-iframe  (Only map locations in Washington, Oregon and California are live)

       

      On mobile devices, however, the scrollbars for the iframe do not display and the overflow cannot be scrolled.

       

      To see an example, visit http://www.jomariworks.com/edge-iframe

       

      Click on the San Diego link (see image below if you are unfamiliar with California geography.)

       

      edge-iframe-map.jpg

       

      The contents of the San Diego iframe are greater than the height of the iframe.  On desktops, this content scrolls; on mobile, the content is truncated and the overflow hidden.  (Note: on this Edge application, overflow is set to visible. On the iframe, I've tried both scrolling=yes and scrolling=auto.)

       

      So my question:

       

      Is there a way to make the iframe scrolling work on mobile devices?  And if not, what is the recommended alternative method of injecting content into the symbol beneath the map?

       

      Thanks in advance for help with this