Making Magic Photos!

A very interesting technique I discovered inside Dreamweaver is using the rollover effect on images. This technique makes pictures EXCITING and EXPLOSIVE! Essentially it displays a normal photo until a mouse rolls over top of it, like a hover effect that make links interactive. This could be used for several different innovative and exciting reasons: interactive pictures like in my photo essay, the logo you have on your site (so people love it and want to come back), and, if you’re feeling it, before and after acne pictures!

So I bet you’re wondering how you can be this cool. It’s actually the easiest thing ever.

  • Make your .html page and have it all fancy and spiffy except for your photo/logo.
  • Have the spot where you want your picture to be and click there. You’re going to go to the tool bar at the top and hit

*insert > image > rollover image

When you do this, a box will pop up that looks like this:

Image

  • As mentioned in the picture, it’s very self explanatory. The original picture gets open in the “original image” section. Similarly, the hover picture gets opened in the “rollover image” section. The title is what it will say in the blank box if your page doesn’t load, so it is important to add a title so if all else fails, people can visualize it.
  • Hit okay, and wha-la! Your thingy is now an interactive neat mosquito thingy!

I tried adding a rollover photo to this post, but I couldn’t really figure it out. If you want to see first hand, visit my site:

http://thoughtsandgoodies.x10.bz/photoessay.html

If you’re like me, you won’t click on it so I’ll show you some side-by-side examples!

(They are actually not side-by-side. I’m not sorry.)

Original Picture:

Image

Rollover Picture:

Image

Original Picture:

Image

Rollover Picture:

Image

-Cody

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s