5 Replies Latest reply on May 28, 2015 1:55 AM by Allison@HavasLynx

    Make text element invisible to mouse

    RyanSteer Level 1

      Hello,

       

      First time posting here as pretty new to EA.

       

      What I would like is to create a rectangle with some text in it, when the user rolls their mouse over the rectangle animates. That I can do. What's annoying me is when I put the text on top the text element 'blocks' the mouse and the interactivity. Is there any way round this?

       

      Thanks in advance,

       

      Ryan

        • 1. Re: Make text element invisible to mouse
          Allison@HavasLynx Level 1

          Hi,

          I think you need to make your rectangle into a symbol.

          Then double click it and add your text inside the rectangle symbol.

          Then back on the main stage add your mouseover code to the symbol.

           

          I have made a little demo - on the left is one where the text is just on top of the rectangle on the main stage. It has the correct mouseover code but it doesn't work because the mouse 'sees' the text not the symbol underneath. On the right is a rectangle symbol with the exact same code, but this time I have put the text inside the symbol itself.

          See if this is what you need.

           

          Dropbox - text-mouse.zip

           

          Cheers

          A

           

          • 2. Re: Make text element invisible to mouse
            seano2o7 Level 3

            Add this to the text element in compositionReady

             

            sym.$("text").css("pointer-events", "none");

            • 3. Re: Make text element invisible to mouse
              RyanSteer Level 1

              Hi Alison,

               

              Thanks for the response. Unfortunately IT block Dropbox so can't view that file but I understand what you are suggesting and it makes sense. I was trying to save some time and avoid this method as I have 7 instances of the symbol each of which needs it's own text label. I can duplicate the symbol though at that will work just fine.

              • 4. Re: Make text element invisible to mouse
                RyanSteer Level 1

                Hi,

                 

                Have tried adding the code but doesn't seem to have any effect, have attached a screenshot was chances are I have it in the wrong place

                 

                codeSnip.png

                • 5. Re: Make text element invisible to mouse
                  Allison@HavasLynx Level 1

                  Glad my answer was of some use!

                  I am a beginner myself so my solutions to things are not always the most elegant.

                   

                  Looking at your description of the project, it sounds as though Sean's suggestion might be better for you though.

                   

                  Maybe try to make sure that the path to your text element is correct.

                  The code you have pasted is looking for an element called "text" that is on your main stage. If your text element is within another symbol it won't be able to find it.

                  So if it's nested within a symbol, maybe try something like:

                  sym.getComposition().getStage().getSymbol("paren-symbol-name").$("text").css("pointer-events", "none");


                  or if the text is on the main stage:

                  sym.getComposition().getStage().$("text").css("pointer-events", "none");


                  Hope that helps!