Back to main AniPack page

Download Photoshop file

Note: we recommend that you save out a new version of the Photoshop animation file before customizing the animation so that if you end up with something you don't like or want to generate a new variation, you can always start over. Of course, you can always download the Photoshop file from the NavWorks site again, but it will usually just be easier and faster if you make your own copies.

To customize the Sliding Panels animation, fill the "Hole" layer with the desired color or texture (make sure the "Preserve Transparency" option is on before applying any fills). The color or texture that you use for the "Hole" layer should match the background color or texture of the Web page that the animation will be playing on. Now fill the "Background" with a color or texture. If you want to add text, place the text above the "Background" layer. You can also Colorize the right and left "slot" layers, if you like, with the Hue/Saturation command using the Colorize option.

To generate the first frame of the Sliding Panles animation, turn on or make visible all of the layers, especially the "Cover" layer. Select All and click on one of the visible layers. Choose Copy Merged from the Edit menu. Paste into a new document. To make Frame 2, turn off the visibility of the "Cover" layer. Now select the "left slot 1" layer and nudge it over to the left seven pixels. Select the "right slot 1" layer and nudge it over to the right seven pixels. Select a visible layer and choose Copy Merged from the Edit menu (this assumes you still have the entire document selected, if you don't Select All). Paste into the new document (the same document that you pasted frame 1 into). To create Frame 3, make the "left slot 1" and "right slot 1" layers invisible. Select a visible layer and choose Copy Merged from the Edit menu. Paste into the new document. Continue this process for the remaining "left slot" and "right slot" layers. For example, to create the next two frames you would nudge the "left slot 2" layer over seven pixels to the left and the "right slot 2" layer seven pixels to the right. Then you would make the "left slot 2" and "right slot 2" layers invisible for frame 4.

If you would need the animation to have less frame, you can skip the step of nudging each matching right and left "slot" layer over seven pixels and just make a frame with each matching set turned invisible in sequence. For instance, you would make frame 1 with all the layers visible, frame 2 would be with the "Cover," "left slot 1," and "right slot 2" layers invisible, frame 3 would be with the with the "left slot 2" and "right slot 2" layers invisible (in addition to the "Cover," "left slot 1," and "right slot 2" layers being invisible), etc. Finally, note that for this animation to loop correctly you will need to make duplicates of many of the layers. For instance, the 8 frame animation would start with frame 1, go to frame 8 and then would go back through frames 7, 6, 5, 4, 3, and 2 to loop back to frame 1.



©1998 NavWorks, All Rights Reserved.