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

 < previous 

 

Slider

 

<action>

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


Description

A slider is a special event that executes actions associated with sliders:

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

  • type: The type of action to execute. The type values that execute slider functions are:

    • adjust_sound_volume: Adjust the volume of a sound clip.

    • adjust_global_volume: Adjust the global volume, which affects all sound clips. The actual volume of each sound clip equals sound_volume multiplied by global_volume.

    • adjust_alpha: Adjust the alpha (transparency) on an object.


  • target: Specifies the ID of the sound or object to apply this action to.

 

Example

<slickboard>
   
   <!-- 2 gray rectangles as slider backgrounds -->
   <rect x='350' y='20' width='20' height='150' fill_color='555555' shadow='hole' /> 
   <rect x='280' y='230' width='150' height='20' fill_color='555555' shadow='hole' /> 
   
   
   <!-- blue circle -->
   <object id='blue_circle'>
      <circle x='100' y='75' radius='50' fill_color='8888ff' shadow='low' /> 
   </object>
   
   
   <!-- blue slider -->
   <object>
      <!-- slider handle -->
      <rect x='340' y='20' width='40' height='40' fill_color='8888ff' shadow='low' state='hit' />   
      
      <!-- constrain the handle vertically -->
      <constrain x='350' y='20' width='20' height='150' reflect='0' />
      
      <action>
         <!-- make the handle draggable -->
         <item type='drag' />
         <!-- adjust the alpha (transparency) of the blue circle when moving the slider -->
         <item type='adjust_alpha' target='blue_circle' event='slider' />
      </action>
      
   </object> 



   <!-- sound clip to load -->
   <sound>
      <clip id='music' url="sounds/slow.mp3" />
   </sound>
   
   <!-- play music at 50% volume to match the initial slider position -->
   <action><item type='sound_play' target='music' volume='.5' event='timer' /></action>
   

   <!-- the red slider is similar to the blue slider, but contrained horizontally -->   
   <object>
      <rect x='335' y='220' width='40' height='40' fill_color='ff4400' shadow='low' state='hit' />   
      <constrain x='280' y='230' width='150' height='20' reflect='0' />
      <action>
         <item type='drag' />

         <!-- adjust the music volume when moving the slider -->
         <item type='adjust_sound_volume' target='music' event='slider' />

      </action>
   </object> 
 
 
   <filter>
      <shadow id='low' distance='1' alpha='.5' blurX='5' blurY='5' />
      <shadow id='hole' alpha='.5' blurX='10' blurY='10' inner='true' />
   </filter>
   
</slickboard>

 

 < previous 


Copyright © 2010-2017, maani.us