This tutorial will show you how to make different parts of your image clickable. Great if you want each head of a family photo to go to a different page, or a sports team photo, or many other possibilities.
On February 21, 2010,
in Video Tutorials,
by iWebUnlimited
If you enjoyed this article, please consider sharing it!
I really like this idea and am excited to use it. Do you know of a way to display the person’s name as you roll-over, kind of like tags on Facebook? Probably would be a different method altogether…
I found a method that works though not quite what I was looking for. I basically took the “Rollover” buttons tutorial and started with that. I made two .png files in Photoshop. Both identical in size and one is completely transparent while the other is transparent but the name of the person at the bottom. I chose the size by placing a shape over the face I wanted and pulling the width and height from that. Then I made an HTML snippet that has the totally transparent image as the “mouse off” state and the one with the name as the “mouse on” state. It works pretty well but sometimes is doesn’t let go of the “mouse on” state even when the mouse isn’t on the image. That’s the best I’ve come up with though.
I am trying to learn how to do 1) Drop Down Menu without HTML Snippet: from your site, however, the long portion of the code that you demonstrate in the video is no longer on you site; http://iwebunlimited.com/2009/iweb-tips/iweb-tip-16-navigation-menus-in-iweb/. Can you please tell me how to get that long portion of the code so that I can attempt the process you describe. Thank you.
The paragon of undretasndnig these issues is right here!
CO5fkl zzxvlahncrkt
Great tutorial man, thank you so much
Great tutorial, I have been looking for this, Just would also like to know how to make the clickable image include an cursor-effect (for example shadow effect, or increase in size/zoom effect), as I know you can do this with clickable text link in i-web, but how would you do this on a clickable image???
Many Thanks