HTML Website Layouts / Templates, Web Site Designers

Page : 1 2 3 4

1. Choose Insert > New Symbol

2. Create a Movie Clip and name it as 'left scroll'.

3. Select the first keyframe on Layer 1

4. Choose Window > Actions

5. Type following action in the Frame Actions panel.

stop ();

//stop();

when actionscript enters left scroll movie clip,it will intially stop at the first frame.

6. Select the second frame (next to first keyframe)

7. Choose Insert > Keyframe

8. Choose Window > Actions

9. Type following action in the Frame Actions panel.

	movespeed = 5;
	if (_root.scroll._x>=97) {
		gotoAndStop (1);
	} else {
		_root.scroll._x += moveSpeed;
	}

//movespeed = 5;
The 'movespeed' variable value determines the moving speed of the scoll movie clip.

//	if (_root.scroll._x>=97) {
		gotoAndStop (1);
	} else {
		_root.scroll._x += moveSpeed;
	}

These actionscript lines check the x position of the scroll movie clip. It will check whether the x position of the scoll movie clip is greater than or equal to 97.If it is so the actionscript will go back to the first frame and will stop there.If the x position of the scroll movie clip is less than 97 then it will make increment in the x position value of the scroll movie clip according to movespeed.This process will stop only when the x position of the scroll movie clip reaches to 97.

10. Select the third frame (next to second keyframe)

11. Choose Insert > Keyframe.

12. Choose Window > Actions

13. Type following action in the Frame Actions panel.

gotoAndPlay (2);

// gotoAndPlay (2);

This action will help the actionscript to track the x position of the scroll movie clip continuously. Once the actionscript enters the second frame then after entering the third frame it will go back in the second frame to once again check the x position of the scroll movie clip.

Similarly we want another scroll handler movie clip to help the scroll movie clip to move the other way.

14. Choose Insert > New Symbol

15. Create a Movie Clip and name it as 'right scroll'.

16. Select the first keyframe on Layer 1

17. Choose Window > Actions

18. Type following action in the Frame Actions panel.

stop ();

19. Select the second frame (next to first keyframe)

20. Choose Insert > Keyframe.

21. Choose Window > Actions

22. Type following action in the Frame Actions panel.

	movespeed = 5;
	if (_root.scroll._x<=-521.4) {
		gotoAndStop (1);
	} else {
		_root.scroll._x -= moveSpeed;
	}

//	if (_root.scroll._x<=-521.4) {
		gotoAndStop (1);
	} else {
		_root.scroll._x -= moveSpeed;
	}

These actionscript lines check the x position of the scroll movie clip. It will check whether the x position of the scoll movie clip is less than or equal to -521.4.If it is so the actionscript will go back to the first frame and will stop there.If the x position of the scroll movie clip is greater than -521.4 then it will make decrement in the x position value of the scroll movie clip according to movespeed .This process will stop only when the x position of the scroll movie clip reaches to -521.4

23. Select the third frame (next to second keyframe)

24. Choose Insert > Keyframe.

25. Choose Window > Actions

26. Type following action in the Frame Actions panel.

gotoAndPlay (2);

27. Go back into the Scene 1

28. Insert a new layer above Scroll layer.(Choose Insert > Layer)

29. Rename the layer as 'Left Scroll'.

30. Choose Window > Library > left scroll

31. Drag the left scroll movie clip on the stage at Left Scroll layer.

32. You can place left scroll movie clip anywhere in the scene.

Note: The left scroll movie clip looks like a dot on the stage.

33. Choose Window > Panels > Instance

34. In the Instance panel give an instance name 'left' to the left scroll movie clip.

35. Insert a new layer above Left Scroll layer. (Choose Insert > Layer)

36. Rename the layer as 'Right Scroll'.

37. Choose Window > Library > right scroll

38. Drag the right scroll movie clip on the stage at Right Scroll layer.

39. Like left scroll movie clip ,this movie clip can be placed anywhere in the scene.Here we have placed it beside the left scroll movie clip.

40. Choose Window > Panels > Instance

41. In the Instance panel give an instance name 'right' to the right scroll movie clip.

Now we want to create scroll buttons to operate these scroll handler movie clips.

1. Choose Insert > New Symbol

2. Create a Button and name it as 'scroll button'.

3. Here we have used an image of scroll arrow. (Choose File > Import) to import the arrow image.

4. Go back into the Scene 1

5. Insert a new layer above the Right Scroll layer.(Choose Insert > Layer)

6. Rename the layer as 'Scroll Buttons'

7. Choose Window > Library > scroll button

8. Drag the scroll button on the stage Scroll Buttons layer.

9. Place the scroll button next to the third thumbnail button.

10. Choose Window > Library > scroll button

11. Drag the scroll button on the stage at Scroll Buttons layer.

12. Place the scroll button before the first thumbnail button.

13. Choose Modify > Transform > Flip Horizontal

Now the scroll buttons are ready.We have to give some actions on them so that they can interact with the scroll handler movie clips and make the scroll movie clip to scroll.