PDA

View Full Version : Spry Vertical Menu bar issue


dovroc
01-27-2008, 11:49 PM
I am working on a very simple vertical Spry Menu bar, and would like to include a different image in each cell. Is there any way of editing the css to do this?

Thanks

m1a2x3x7
01-30-2008, 01:42 PM
yes there is.

Go Here

http://labs.adobe.com/technologies/spry/samples/ (http://labs.adobe.com/technologies/spry/samples/)

Click the Widget Tab

Scroll Down to menu bar

The example they show is in a horizontal menu bar but you can still see how it is done with the CSS. View the page source and you will be able to find the CSS they used.

The Menu Bar is number 7 and here is the Code they used.

#MenuBar7 li {
width: 10em;
}
#MenuBar7 ul, #MenuBar7 ul li {
width: 15em;
}
#MenuBar7 span {
margin: 0;
padding: 2px;
padding-left: 22px;
display: block;
background-position: 0% 50%;
background-repeat: no-repeat;
}
#MenuBar7 #item1 {
background-image: url(images/numberedList.gif);
}
#MenuBar7 #item1-1 {
background-image: url(images/italic.gif);
}
#MenuBar7 #item3 {
background-image: url(images/home.gif);
}
#MenuBar7 #item3-1 {
background-image: url(images/forward.gif);
}
#MenuBar7 #item3-3 {
background-image: url(images/justifyAlign.gif);
}
#MenuBar7 #item3-1-1 {
background-image: url(images/new.gif);
}


hope this helps.