4 Replies Latest reply on Feb 5, 2014 10:22 AM by AMULI

    how to make text unselectable ?

    AMULI Level 4

      Hi,

       

      Is there a way to make the text entries of an accordion unselectable, in order to avoid such situation :

       

      Capture d’écran 2014-01-11 à 19.29.18.png

       

      Gil

        • 1. Re: how to make text unselectable ?
          boxofspiders Level 1

          Hi there,

           

          I can think of two ways to do this, the first would be to set it with a .css attribute:

          (For cross browser compatibility all three are needed)

           

          -webkit-user-select: none;  /* Chrome all / Safari all */
          -moz-user-select: none;     /* Firefox all */
          -ms-user-select: none;      /* IE 10+ */
          

           

          So something like:

           

          sym.$("textSymbolName").css("webkit-user-select","none");
          sym.$("textSymbolName").css("moz-user-select","none");
          sym.$("textSymbolName").css("ms-user-select","none");
          
          

           

          The other way and not quite so elegant would be to simply put a transparent shape over the top of the text field.

           

          Hope this helps!

           

          Only just spotted how old this post is!

          • 2. Re: how to make text unselectable ?
            AMULI Level 4

            Thanks a lot, boxofspiders. I will try the elegant way, via a function

             

            Gil

            • 4. Re: how to make text unselectable ?
              AMULI Level 4

              I finally tried :

               

              document.compositionReady :

               

              sym.nonSelect = function( $entree)

              {

                $entree.css( "webkit-user-select", "none");

                $entree.css( "moz-user-select", "none");

                $entree.css( "ms-user-select", "none");

              }

               

              <menuSymbol>.creationComplete :

               

              sym.getComposition().getStage().nonSelect( sym.$( '<itemID>'));

               

              But the items remain selectable :

               

              Capture d’écran 2014-02-05 à 19.03.10.png

               

              And if I drag to the left, this even makes the main content to be selected !

               

              Capture d’écran 2014-02-05 à 19.04.26.png

               

              Surely, I miss something. Any ideas ?

               

              Gil