Hybrid View

  1. #1
    Sencha User
    Join Date
    Jun 2010
    Posts
    139
    Vote Rating
    3
    jeanluca is on a distinguished road

      0  

    Default how to apply animation to an element

    how to apply animation to an element


    Hello

    Is it possible to animate an element by its 'left/top' style property based on its id (using Sencha Touch 2 of course)?

    I've checked Ext.Anim but I don't think that object can do it. Any suggestions how to do this ?

    Cheers
    Luca

  2. #2
    Touch Premium Member
    Join Date
    Dec 2010
    Location
    Jakarta, Indonesia
    Posts
    49
    Vote Rating
    0
    trinitrotoluen is on a distinguished road

      0  

    Default


    As an alternative you can try adding custom css animation function to your element, something like this :
    PHP Code:
      .anim {
                    
    vertical-align:middle;
                    
    padding-left:34px;
                    
    padding-top:21px;
                    
    background-color:#000000;
                    
    width:80px;
                    
    height:63px;
                     -
    webkit-transition-duration90ms
                    -
    webkit-transformtranslate3d(0,0,0); 
                    -
    webkit-transition-timing-function:ease-in;
                    
    left0;
                    
    top0;
           } 
    I implemented the code to animate an image in each item of my list component

  3. #3
    Sencha User
    Join Date
    Jun 2010
    Posts
    139
    Vote Rating
    3
    jeanluca is on a distinguished road

      0  

    Default


    thanks, I didn't think of that! Very useful indeed!!

    BTW, I found out how to do it with animations in ST: http://stackoverflow.com/questions/9...sencha-touch-2

Thread Participants: 1