0 Replies Latest reply on Apr 30, 2015 7:13 AM by DJBellisle

    "Pop-up" not working the same way in desktop browser & iPad

    DJBellisle Level 1

      I've got an HTML page with a large image on it. I've surrounded a section of the image with a dashed rectangle & want a small help "pop-up" window to appear when a user clicks or taps within that section. The pop-up has four elements: a background image, a block of text, a small arrowhead that points to the dashed-rectangle section, and a closing "X" in the corner; when the user clicks or taps on the X the pop-up should close.

       

      So, the elements in play:

       

      • Section = area for users to click/tap on (no fill, dashed line border)
      • SectionBackground = background for pop-up (rounded rectangle, white fill, drop shadow)
      • SectionText = text appearing in pop-up
      • SectionArrow = small arrowhead image (with faux drop shadow), aligned with top of SectionBackground
      • SectionCloseX = "X" in a circle, aligned with upper-right corner of SectionBackground

       

      Actions I have set up:

       

        Section

        touchstart

        sym.$("SectionBackground").show();

        sym.$("SectionText").show();

        sym.$("SectionArrow").show();

        sym.$("SectionCloseX").show();

        click

        sym.$("SectionBackground").show();

        sym.$("SectionText").show();

        sym.$("SectionArrow").show();

        sym.$("SectionCloseX").show();

       

        SectionCloseX

        touchstart

        sym.$("SectionBackground").hide();

        sym.$("SectionText").hide();

        sym.$("SectionArrow").hide();

        sym.$("SectionCloseX").hide();

        click

        sym.$("SectionBackground").hide();

        sym.$("SectionText").hide();

        sym.$("SectionArrow").hide();

        sym.$("SectionCloseX").hide();

       

      Result: in a desktop web browser, it works perfectly. On an iPad, only SectionBackground and SectionText appear; SectionArrow and SectionCloseX do not appear on the screen (although I think they might be there--tapping on the screen where SectionCloseX should be does close the pop-up).

       

      Self-learning Edge and JavaScript, so obviously I've mucked something up, but I can't puzzle out what the problem is. Little help?

       

      DB