|
You should have completed part one to do this tutorial.
1. Open your bloody eyeball image from part
1. It should have 2 layers, a black background and an eyeball
layer. Duplicate the eyeball layer 6 times so you have 7 different eyeball
layers. Rename the eyeball layers eyeball 1, eyeball 2, eyeball 3, eyeball
4, eyeball 5, eyeball 6, eyeball 7. Turn off visibility on all the layers
except eyeball1 and the background.
3. Switch to image ready by clicking file=> jump to image ready.
4. Open your Rollover panel. Click the button on the bottom of the
rollover panel to add a rollover. Highlight the rollover.
5. Open your animation panel.
Frame 1: The first frame is set to 0.1 second and has no changes.
Frame 2: Turn off eyeball 1, turn on eyeball 2 and click on it.. Click
edit=> transfrom=> rotate. set rotation to 51 degrees. Frame should be set
to 0.1 seconds.
Frame 3: Turn off eyeball 2, turn on eyeball 3 and click on it.. Click
edit=> transfrom=> rotate. set rotation to 102 degrees. Frame should be set
to 0.1 seconds.
Frame 4: Turn off eyeball 3, turn on eyeball 4 and click on it.. Click
edit=> transfrom=> rotate. set rotation to 154 degrees. Frame should be set
to 0.1 seconds.
Frame 5: Turn off eyeball 4, turn on eyeball 5 and click on it..
Click edit=> transfrom=> rotate. set rotation to 205 degrees. Frame should
be set to 0.1 seconds.
Frame 6: Turn off eyeball 5, turn on eyeball 6 and click on it.. Click
edit=> transfrom=> rotate. set rotation to 257 degrees. Frame should be set
to 0.1 seconds.
Frame 7: Turn off eyeball 6, turn on eyeball 7 and click on it.. Click
edit=> transfrom=> rotate. set rotation to 308 degrees. Frame should be set
to 0.1 seconds.
Test out the animation by using the animation player on the bottom of the
animation panel.
6. Click back on frame1. Open your optimize panel. Set to Gif, 64colors
dithered in the settings drop down menu.
Click save optimized as and save your image a HTML and images and
animatedeyeball.
7. Open your notepad by clicking start=> program=>
accessories=> notepad. Use notepad to open your animatedeyeball.html by
clicking file=> open. Set the file type to "all files" and find your
animatedeyeball.html. Your html is divided into 3 areas that you will need
to paste into your html for your page where you want to use them.
- Script for the head of your page will occur between these
tags:
<!-- ImageReady Preload Script (bloodyeyeball) --> <!-- End Preload
Script -->
Place this script between the head tags in your html.
example: <head> script here </head>
- The onload statement in the body tag
<BODY BGCOLOR=#FFFFFF LEFTMARGIN=0 TOPMARGIN=0 MARGINWIDTH=0
MARGINHEIGHT=0 ONLOAD="preloadImages();">
Copy the onload statement into your body tag. <body ONLOAD="preloadImages();">
- The Code for the rollover is between the following two
tags:
<!-- ImageReady Slices (Untitled-1) -->
<!-- End ImageReady Slices -->
This code should go in an area set aside for a 100X100 image within
the page.
If you do not paste all the code, or put it in the wrong place you will
get mouseover errors.
|
