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

 < previousnext > 

 

Timer

 

<action>

     <item type='string' event='timer' delay='number' ... />
     ...
   
</action>
             


Description

A timer is a special event that executes an action item after an initial delay without a user input:

  • event: Set this to "timer" to create a timer event.

  • delay: The number of seconds to delay the execution of this action. The delay starts from the moment the enclosing object is transitioned in. The default is zero.

Timers must take into account the order in which objects are constructed. They must be triggered after the objects they affect are constructed.

 

Example

<slickboard>
    
   <!-- reload the webpage to test this again -->


   <!-- sound clips to load -->
   <sound>
      <clip id='music' url="sounds/slow.mp3" />
      <clip id='yeah' url="sounds/yeah.mp3" />
   </sound>
   
   
   <!-- gray background circle -->
   <circle x='240' y='150' radius='90' fill_color='555555' /> 
   
   
   <!-- timer action triggerd one second after starting the board -->
   <!-- this timer starts playing the first sound before the red circle appears -->
   <action>
      <item type='sound_play' target='music' event='timer' delay='1' />
   </action>


   <!-- a red circle that transitions in 3 seconds after starting the board -->
   <object>   
      <circle x='240' y='150' radius='75' fill_color='FF6600' shadow='default' /> 
      <transition_in type='fly' startPoint='2' easing='bounce' duration='1' delay='3' />   
      
      <!-- this timer plays the second sound 5 seconds after the circle appears -->
      <action>
         <item type='sound_play' target='yeah' event='timer' delay='5' />
      </action>
   </object >

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

 

 < previousnext > 


Copyright © 2010-2017, maani.us