Jump to content

inline :hover


henryhenry

Recommended Posts

Hello!I am trying to define a :hover pseudo class inline. The reason is that I have a php script for a menu and I want the little arrows to display only if there is another level to the menu and then to change colour when hovering over the item. All works except for the hover. The problem is I can't define the :hover in the css external file because it has to be conditional. If I put a <style> tag even just after the <a> tag it applies it as if I'd put it in the <head> (ie to the whole page rather than just the part I want).Is it possible (prefer no javascript)?Thanks!!Henry

Link to comment
Share on other sites

So you change the (im guessing) <li> tag to include a pic of a arrow?If so then just make it like this (adapt to fit your situation):

//CSS Code#nav ul li{background: url(arrowfile.jpg) no-repeat 2px 3px;}#nav ul li:hover{background: url(hover_arrowfile.jpg) no-repeat 2px 3px;}

Unfortunately that will only work in FFox because IE is terrible at assigning hover functions to anything other than <a>. Also you may need to mod the pixel alignments on the background tag in the css.The way to make it IE is as below:

//CSS Code#nav ul li a{background: url(arrowfile.jpg) no-repeat 2px 3px;}#nav ul li a:hover{background: url(hover_arrowfile.jpg) no-repeat 2px 3px;}

Hopefully that should work and well with IE also. Youll just have to add <a> tags in your nav (which you should have anyway :) ). Now for it to come up when theres a sub-section available just change the #nav ul li to a class name like .nav_parent and the PHP should make it that IF there is a sub section then print the li tag to have a class of .nav_parentIs that understandable? Im sort of pepped on Pepsi atm :)

Link to comment
Share on other sites

Hi Xenon DesignThanks for the great solution! I can see it works!Unfortunately everything is against me today so it's not working on my actual page yet ... but the solution obviously works - I'm just having a bad day!Henry

Link to comment
Share on other sites

It happens to the best of us dont worry :)I was at work and I realized the PC I had about a months work on had died and I had to start from scratch. 20 PHP files and a whole database setup gone :) But I got it back again :)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...