2 Replies Latest reply on Apr 25, 2014 2:23 PM by Zaxist

    Issues with Overlapping Symbols

    Ross_P Level 1

      Hi,

       

      I've created an interactive guide on how a piece of scientific apparatus works using Edge Animate, but I've ran into a problem and I'm hoping the community might be able to help me.

       

      What I've Done So Far

       

      - Created flyout tooltips that animate as users hover over each component of the instrument. This is achieved by using mouse over (play symbol from label) , mouseout (play reverse)

      - Created descriptions of each component that display in a blue box beside the diagram as the parts are clicked on

       

      hplc-simulator-01.jpg

      Problem

       

      The descriptions worked fine, but when I created the fly-out tooltips, I started encountering a problem. As I hover over the diagram, the tooltips are sticking in the mouse over state and not always disappearing on mouseout. If I scan the mouse pointer across the image all tooltips show up and remain on. I'm not sure if the problem is caused by the overlapping symbols.

       

      Does anyone know what could be causing this problem? I'm fairly new to Edge Animate, so I'm sure it will be something quite obvious to a more experienced user.

       

      Many thanks,


      Ross

       

      Message was edited by: Ross_P

        • 1. Re: Issues with Overlapping Symbols
          TimJaramillo Level 4

          Hi Ross, you might want to start with replacing 'mouseover' with 'mouseenter', and 'mouseout' with 'mouseleave'.

           

          'mouseenter' and 'mouseleave' will give you more predictable results than 'mouseover' and 'mouseout'. In my experience, "mouseover" and "mouseout" can have weird behavior if your symbol has nested objects. As your mouse moves over the nested objects, it will cause errant "mouseout" events to trigger.

          1 person found this helpful
          • 2. Re: Issues with Overlapping Symbols
            Zaxist Level 4

            you need to have mouseenter and mouseover with same code, mouseleave and mouseout with the same code to prevent the problem from happening

             

             

            regards

            Zaxist

            1 person found this helpful