Rollover hover ect..

[Natural Tone]

Hi im looking for a guide to change the side links for the category box, New product box... ect. So that i have CSS rollover colour changes and borders around each link. Is there any around as a guide for Zen carts?

[shirster]

URL to your shop?

Shirley :)

[misty]

Hi im looking for a guide to change the side links for the category box, New product box... ect. So that i have CSS rollover colour changes and borders around each link. Is there any around as a guide for Zen carts?

http://www.zen-cart.com/index.php?ma...roducts_id=609
Category Dressing mod from above url may help

[GLV]

That mod is a mess! Why does it have all kinds of random stuff inserted "for examples" as the default?

Turns out I only need 1 line in that css file to just have a rollover text coloring on my category names, too bad I can't figure out how to clean up the template file so it stops putting multiple categories on one line in the sidebox and randomly inserting a junk image between 2 of them

Text rollover should work on that sidebox normally, it does on all the rest!

[GLV]

Nevermind, I found the following on another thread and it saved my tail and tons of time. Turns out I missed the "-top" when I tried to do it myself.

There is a "pseudo-style" called :hover which causes the behavior you want.

You can add this to the end of any link in your stylesheet, specify the CSS effects desired, and they will be applied on hover. (This is supposed to work on anything, but IE only supports it on links, so there's not much point trying it on anything else.)

You can see an example at the top of a stock stylesheet:

a:link, #navEZPagesTOC ul li a {
	color: #3300FF;
	text-decoration: none;
	}
 
a:visited {
	color: #3300FF;
	text-decoration: none;
	}

a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover {
	color: #FF0000;
	}

Links are blue, recently visited links are also blue, and hovering links are red.

a.category-top is a good place to start for styling category links.
Use

a.category-top:hover {

}

for hover effects.

[claudea2]

Hello,

I have a similar problem with changing roll over colors to #ff0080.

I can change the color of the categories listing and of the links but not the rest of the links on the page.

I added the following code the the style sheet:

a.category-top:hover { /* Added C. Arpin 28apr2009 works*/
color: #ff0080;
/*text-decoration: none;*/
}

a.category-links:hover { /* Added C. Arpin 28apr2009 works*/
color: #ff0080;
/*text-decoration: none; */
}

This does nothing:

a.sideBoxContent:hover { /* Added C. Arpin 28apr2009 does nothing */
color: #ff0080;
/* text-decoration: none; */
}

Also changing the color in this line does nothing:

a:hover, #navEZPagesTOC ul li a:hover, #navMain ul li a:hover, #navSupp ul li a:hover, #navCatTabs ul li a:hover {
color: #ff0080; /* old color: #666666; */
}

but I can change the boldness and spacing with:

.sideBoxContent {
background-color: transparent;
padding: 0.4em;
font-weight: bold; /* Added C. Arpin 28apr2009 */
line-height: 1.5em; /* Added C. Arpin 28apr2009 */
}


The theme is based on red passion but with many changes.
http://www.daillynails.com

thanks

Claude

[claudea2]

Hello again,

I found the error.

When I change something in a site, I save the original file before changing it. I was saving the style sheet as stylesheetold.css instead of stylesheet.old

The a:hover works great.


Claude