Linking an image and a spry nav bar

Hot Stuff

Win a Wacom Tablet
We're giving away one Wacom tablet!

Forums > Web Design

Written by Leslie Westbrook on May 5, 2008

Hi! I am trying to link a rollover image with my spry nav bar, and I don't know if it's possible. What I want to have happen is that when I mouse over my black and white image, the nav bar will appear and become functional at the same time that the image appears in color. Can anyone out there PLEASE help me???? Thanks!

Add to My List

Possible solution

Hey Leslie,

Does this how-to help? Seems like it's relevant:

http://www.creativepro.com/article/view-source-the-easy-way-add-dynamic-...

Terri Stone
Editor in Chief, CreativePro.com

Submitted by Editor in Chief on Wed, 05/07/2008 - 08:39.

Spry Nav Bar linked with rollover image

Thanks, but no. I've already been thru this how-to with a fine tooth comb, and have seen no place that shows me how to have my Spry Nav Bar APPEAR when the user rolls over my image. If anyone can help, PLEASE let me know! Thanks!!

Submitted by redwestbrook on Mon, 05/19/2008 - 08:21.

Check this out.

I don't have an answer to your problem, but if you post to the Spry community discussion board, you might get some better feedback. The Spry experts are all on there, including all the members of the Spry team itself.

http://www.adobe.com/go/labs_spry_pr1_forum

Submitted by FindYourPath on Thu, 06/12/2008 - 14:42.

Its in the CSS code

In the CSS, file about line 95 you will want to Modify the following lines:

HERE IS THE ORIGINAL BLOCK OF CODE
ul.MenuBarHorizontal a
{
display: block;
cursor: pointer;
background-color: #CCCCCC;
padding: 0.5em 1.25em;
color: #000000;
text-decoration: none;

AND MODIFY IT WITH

ul.MenuBarHorizontal a, li /*NOTICE ADDITION of LI Tag*/
{
display: block;
cursor: pointer;
background-image:url(../assets/menugradient.gif); /*PATH TO IMAGE FILE*/
background-repeat:repeat; /*REMEMBER TO REPEAT IMAGE*/
padding: 0.5em 1.25em;
color: #000000;
text-decoration: none;

}

I found this in another website, so check it out for full thread. They also discuss the hack for IE. here is the thread: http://friendsofed.infopop.net/4/OpenTopic?a=tpc&s=989094322&f=296302730...
---------------------------------------------