SlickBoard | CSS/XML Timeline (new) | XML/SWF Charts | Timeline Eons

 < previousnext > 

 

Reset

 

<action>

     <item type='string' 
           target='string' 
           duration='number' 
           easing='string' 
           
           location_h='boolean'
           location_v='boolean'
           scale_h='boolean'
           scale_v='boolean'
           rotation='boolean'
           alpha='boolean'
           visible='boolean' 
           />
     ...
   
</action>
             


Description

The action tags can be added to an object and enclose any number of items, each executes an action when triggered by an event.

Scaling and rotating an object usually affect its location. To reset the location of an object, it is necessary to reset both its scale and rotation too.

 

  • type: The type of action to execute. The type values that reset objects are:

    • reset: Reset the target object.


  • target: Specifies the ID of the object to apply this action to. If this attribute is omitted, then the object that encloses this action is targeted.

  • duration: The number of seconds it takes to transform the object. A value of zero transforms the object instantly. Larger values transform the object gradually. The default is 2.

  • easing: The way the animation comes to a stop. Valid values are:

    • back: Moves the object past its destination and then brings it back.

    • bounce: Bounces the abject on its destination with several decaying rebounds.

    • elastic: Bounces the abject past its destination and then back with several decaying rebounds.

    • regular: Slows down the object to its destination. This is the default value.

    • strong: Similar to regular, but starts faster and decelerates faster.

    • none: Moves the object to its destination without a change in speed.


  • location_h: Determines whether to reset the horizontal location of the object or not. Valid values are true and false. The default is true.

  • location_v: Determines whether to reset the vertical location of the object or not. Valid values are true and false. The default is true.

  • scale_h: Determines whether to reset the horizontal scale of the object or not. Valid values are true and false. The default is true.

  • scale_v: Determines whether to reset the vertical scale of the object or not. Valid values are true and false. The default is true.

  • rotation: Determines whether to reset the rotation of the object or not. Valid values are true and false. The default is true.

  • alpha: Determines whether to reset the transparency of the object or not. Valid values are true and false. The default is true.

  • visible: Determines whether to reset the visibility of the object or not (in case it was hidden). Valid values are true and false. The default is true.

 

Example

<slickboard>

   <!-- drag, rotate and scale the red square and then press the reset button -->
   
   
   <!-- object that contains the red square, black circle, and black square -->
   <object id='red_square'>
      
      <!-- draggable red square -->
      <rect x='150' y='100' width='90' height='90' fill_color='ff4400' state='hit' />   
      <action><item type='drag' float='false' /></action>
   
     
      <!-- black circle that rotates the red square -->
      <object>
         <circle x='230' y='110' radius='7' state='hit' />
         <action><item type='rotate' target='red_square' float='false' /></action>
      </object>
      
     
      <!-- black square that rotates and scales the red square -->
      <object>
         <rect x='220' y='170' width='15' height='15' state='hit' />
         <action>
            <item type='rotate' target='red_square' float='false' />
            <item type='scale' target='red_square' float='false' />
         </action>
      </object>
      
   </object>
   
   
   <!-- reset button -->
   <object>   
      <rect x='390' y='250' width='70' height='30' fill_color='FF6600' shadow='default' state='hit' />   
      <text x='390' y='255' width='70' alpha='.6' align_h='center' shadow='default'>Reset</text>   
      <action>
         <item type='reset' target='red_square' duration='1' easing='back' />
      </action>
   </object>


   <filter>
      <shadow id='default' />
   </filter>
   
</slickboard>

 

 < previousnext > 


Copyright © 2010-2017, maani.us