Slider Navigation

Actionscript:
  1. var thumbNum:Number = 20;
  2. var spacing:Number = 10;
  3. var thumbs:MovieClip = new MovieClip();
  4. addChild(thumbs);
  5. for (var i:int = 0; i<thumbNum; i++){
  6.     var t:MovieClip = new MovieClip();
  7.     with(t.graphics) beginFill(0x666666), drawRect(0,0,100,50);
  8.     t.x = i * (t.width + spacing);
  9.     t.y = 5;
  10.     t.buttonMode = true;
  11.     thumbs.addChild(t);
  12. }
  13. var minX:Number = stage.stageWidth - thumbs.width - spacing;
  14. var destX:Number = thumbs.x = spacing;
  15. var velX:Number = 10;
  16. var stageThird:Number =  stage.stageWidth / 3;
  17. var right:Number = stageThird * 2;
  18. var left:Number  = stageThird;
  19. addEventListener(Event.ENTER_FRAME, onLoop);
  20. function onLoop(evt:Event):void {
  21.     if (mouseX> right){
  22.        destX -= velX;
  23.     }
  24.     if (mouseX <left){
  25.         destX += velX;
  26.     }
  27.     if (destX <minX){
  28.         destX = minX;
  29.     }
  30.     if (destX> spacing){
  31.         destX = spacing;
  32.     }
  33.     thumbs.x += (destX - thumbs.x) /4;
  34. }

This snippet shows a technique for a common type of navigation.

This entry was posted in UI, motion and tagged , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*