logo-dw

Go Back   Dreamweaver Club Forums > Dreamweaver forums > Spry
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 09-09-2011, 02:26 PM   #1
nicusa
 
Join Date: Jan 2010
Posts: 20
Default how to add a rollover image effect to an existing vertical menu bar

Hi,

I know that to create a rollover image effect you must have to same size images. The first image will show when the page is first loaded and the background image will show when the user hover the mouse over it.

How can I do this to an existing spry vertical menu bar?
1. how can i insert the first image?
2. how can i place the background image?
here is my website

www.rentajumperfl.com

thank you,
nicusa is offline   Reply With Quote
Old 09-10-2011, 03:34 AM   #2
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

Sorry to be give you bad news but trying to use images for links in a Spry Menubar is quite complex and something I recommend against.
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 09-10-2011, 08:35 PM   #3
nicusa
 
Join Date: Jan 2010
Posts: 20
Default

thank you for your reply.

then, what is the best way to create a menu bar with custom images? or custom buttons?

I did add background images to my menu bar and when the cursor hovers over it it changes. Is this appropiate?
nicusa is offline   Reply With Quote
Old 09-10-2011, 08:46 PM   #4
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

Sorry I might have misunderstood you. Using a background image in a Spry menubar and having it change ob rollover is fine. I do that occasionally but I still use text for the text of the link. So I don't have to create individual images and style rules for each link. The only problem that sometimes arises is when the text link wraps to a second line and the background image doesn't work for two lines.
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 09-10-2011, 09:05 PM   #5
nicusa
 
Join Date: Jan 2010
Posts: 20
Default

just for future reference. If I have a set of custom made buttons (images), what would be a good way to create a menu bar with them?
nicusa is offline   Reply With Quote
Old 09-11-2011, 09:31 PM   #6
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

If you make a UL/LI list you can use a background image that consist of all the button graphics needed.

Then:
(first make sure the list is outputting right, either horizontal or vertical)
1. Set a width and height on each link.
2. Give each link a unique ID.
3. For each link use the same background image, but only show the part of the background that is appropriate for the link. (background-position)
4. Change the background-position for each link on :hover.

This approach requires some CSS skills, but it uses only one image for all the navigation 'buttons', which speeds up loading time and makes creating the menu bar more easy.
domedia is offline   Reply With Quote
Old 09-12-2011, 07:51 PM   #7
dbepp
dbepp's Avatar
 
Join Date: Jun 2011
Location: Indiana
Posts: 93
Default

For a tutorial check out http://www.dreamweavertutorial.co.uk...reamweaver.htm
dbepp is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 02:34 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com