Developing Webs logo
Google
Web DW-Main DW-Photoshop
Visit the message board for solutions or post a question Check out the Classes offered for free at Developing Webs Voice Chat submit a tutorial, resources, article, font for publication consideration and earn a one way link back to your site Get more specifics about the Developing Webs Voice chat room and its room members View the current news at Developing Webs alternative sites which are resources for your d3evelopment needs Join Developing Webs Chat Link to us on your web page to help support this resource! Check out Developing Webs At yahoo groups! Developing Webs Home Adobe Photoshop Tutorials Macromedia Flash Tutorials Jasc Paint Shop Pro Tutorials Adobe Illustrator Animation basics Some Basic PHP tutorials Perl Tutorials HTML Tutorials Cascading Style Sheets javascript Front Page Tutorials Macromedia Dream Weaver Tutorials dreamweaver Publishing your site, FTP, ChMod, Promotions Tools to help you create your site Free and shareware fonts to download Photographs to use in your projects Shop for your site needs Free Online classes REcommend this site to others Log in or edit your information when logged in Developingwebs Log Out Change My Account details and preferences
RSS Newsfeed
for your site
DW News
Calendar
DW Forum
Right click on button and copy shortcut

Add to My Yahoo!

Reminder
Remember to book mark this site!



Request a Tutorial

Haunted House part 5

1  2  3  4  5  6 final product

continued from part 4

Image Ready Rollovers

83. Switch to image Ready by clicking the link at the bottom of the Photoshop tool bar.

84. Select the slice tool. Draw a rectangle slice around each of the hot spot areas listed below.

  • The moon area where the devil will show up
  • The middle gargoyle that will turn into a dragon.
  • The trap door.
  • The gargoyle knocker and bat trail
  • The left door and the skull trail
  • The skeleton path from the cemetery
  • The lamp on left
  • The Cat
  • the pumpkins.

Devil Rollover

85. Switch to your Slice select tool. Select the slice for the devil. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel.

Frame 1:  Highlight the first frame of the animation. set the following

  • Turn on the devil set, and only the one devil layer with 15% opacity.
  • Set the timing to 0.2 seconds
  • Change the animation from forever to once.

Frame 2: Duplicate from 1 by clicking the duplicate frame icon on the bottom of the animation panel. Set the following

  • Turn off the 15 % opacity devil and turn on the 25% opacity devil layer.
  • Set the timing to 0.2 seconds

Frame 3: Duplicate frame 2 by clicking the duplicate frame icon on the bottom of the animation panel.

  • Turn off the 25% opacity devil layer and turn on the 50% opacity layer.
  • Set the timing to 2 seconds.

Frame 4: Duplicate frame 3. Set the following:

  • Turn off your devil layers.
  • Set the timing to no delay

Gargoyle Rollover

86. Switch to your Slice select tool. Select the slice for the center peak gargoyle. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the gargoyle layer set.

Frame 1:  Highlight the first frame of the animation. set the following:

  • Turn off the small gargoyle layer in the set. Turn on the next larger image.
  • Set the time to 0.1 seconds
  • Change the animation from forever to once.

Frame 2: Duplicate from 1 by clicking the duplicate frame icon on the bottom of the animation panel. Set the following

  • Turn off the gargoyle layer in the set. Turn on the next larger image.
  • Set the time to 0.1 seconds

Frame 3: Duplicate from 2 by clicking the duplicate frame icon on the bottom of the animation panel. Set the following

  • Turn off the gargoyle layer in the set. Turn on the next larger image.
  • Set the time to 0.1 seconds

Frame 4: Duplicate from 3 by clicking the duplicate frame icon on the bottom of the animation panel. Set the following

  • Turn off the gargoyle layer in the set. Turn on the largest image.
  • Set the time to 1 seconds

Frame 5: Click back on Frame 3. Duplicate 3 by clicking the duplicate frame icon on the bottom of the animation panel. Drag it to the end of the frames on the animation panel

Frame 6: Duplicate from 5 by clicking the duplicate frame icon on the bottom of the animation panel. Set the following

  • Turn off the gargoyle layer in the set. Turn on the smallest image.
  • Set the time to 0.1 seconds

Trap Door Rollover

87. Switch to your Slice select tool. Select the slice for the Trap Door. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the trapdoor layer set.

Frame 1:

  • Turn on void
  • Turn on door image that covers 3/3 of the void, no hand.
  • 0.1 sec
  • Change the animation from forever to once.

Frame 2:

  • Void on
  • door image that covbers only 1./3 the void.
  • 0.1 sec

Frame 3:

  • Void on only
  • 0.2 sec

Frame 4

  • void on
  • hand half over void.
  • 0.1 sec

Frame 5

  • void on
  • hand all the way across void
  • 0.1 sec

Frame 6

  • void on
  • hand and door combined and 1/3 covering void
  • 0.1 sec

Frame 7

  • void on
  • hand and door combined and covering 2/3 void.
  • 0.1 sec

Frame 8:

  • turn trap door layer set off.
  • 0.1 sec

Bats Rollover

88. Switch to your Slice select tool. Select the slice for the gargoyle knocker and bats. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the Bats layer set.

  • 6 frames
  • set to play only once.
  • each at no delay.
  • smallest bats in frame 1 to largest bats in frame 5 to just the knocker in frame 6

Skull Rollover

89. Switch to your Slice select tool. Select the slice for the skull at the door. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the Skull layer set.

  • 6 frames
  • Set to play only once
  • frame 1 = smallest skull by door.
  • Frame 5 = larges skull
  • Frame 6 = skull layer set is turned off.
  • No delay on frame 1 and 2
  • 0.1 seconds on frame 3 and 4
  • 0.2 seconds on frames 5 and 6

Skeleton Rollover

90. Switch to your Slice select tool. Select the slice for the cemetery on the right. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the Skeleton layer set.

  • 7 frames
  • playing only once.
  • frame 1 is smallest skeleton, frame 6 is largest half off screen.
  • Frame 7 has no skeleton.
  • No delay on frames 1-4, and 7
  • 0.1 Sec for frames 5-6

Cat Rollover

91. Switch to your Slice select tool. Select the slice for the cemetery on the right. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the Skeleton layer set.

  • 3 frames
  • playing only once.
  • frame 1 is middle cat, frame 2 is arched back cat.
  • Frame 7 has the lying down cat..
  • 0.5 sec on frames 1
  • 2 seconds on frame 2
  • No delay on frame 3

Lamp rollover

92. Switch to your Slice select tool. Select the slice for the lamp. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, Turn on the lens flare layer. (no animation here)

Pumpkin Rollover

93. Switch to your Slice select tool. Select the slice for thepumpkins. Open your rollover palette. Click the icon on the bottom of the rollover palette to add a rollover. When the slice rollover is highlighted, open the animation panel. Open the pumpkin layer set.

  • 3 frames
  • playing only once.
  • frame 1 is pumpkins layer with blending options turned off.
  • Frame two is the other pumpkin layer with the blending mode in color burn mode.
  • Frame three is the first pumpkin layer with blending options on.
  • 0.1 sec on frames 1
  • 2 seconds on frame 2
  • No delay on frame 3

Continue on to Part 6

 



"Building The Web Into a Nicer Place -- One Site At A Time"
Developing Webs Group Copyright © 2001-2012 All Rights Reserved
Privacy and Legal





iSECURE Network Security