Defining A:Link and A:Hover values in-line?

[DaveLinger]

What I'm trying to do is have a link ("a" tag) which is just an image, 150x150. If you click it, it goes somewhere. On hover over, it should change to a different 150x150 image. Only problem is, due to the php code determining the bg image url, I have to do it inline.

 

<div style="width:150px; height:150px; a:link {background-image:url(frozen/thumbs/1_f.jpg);} a:hover {background-image:url(frozen/thumbs/1_c.jpg);}"><a href="frozen/1.jpg""> </a></div>

 

This code does not show the image.

[calabiyau]

are your image paths stored in a database that relates the link/hover thumbnail to each other and to the image they lead to?  If they are, then you can dynamically generate the css info:

 

//put this php code within your css in the head section
//run your query, selecting all rows from the images table.
//then while looping through the array
echo "#image" .$row['id']. " {width: " .$row['width']. "; height: " .$row['height'].
"background: url(" .$row['thumbnail_off_path']. ");}";
echo "#image" .$row['id]. ":hover {background: url(".$row['thumbnail_on_path'].");}";

 

Then in the body where you want the links to show up

//run your query to select all rows of the images table
//while looping through the array
echo '<a id="' .$row['id'].'" href="'.$row['path_to_full_image'].'"></a>';

 

If your not using a database to dynamically generate your links, I'm not sure how you'd do it as there's no way really to relate the background images to each other and to the main image.  But if you want to set up a table for it you'd just need rows for id, link_off_path, link_on_path and target_path

[soycharliente]

Did you try putting your link definitions in the actual link tag?