TeamPhotoshop
Reviews, updates and in depth guides to your favourite mobile games - AppGamer.com
Forum Home Latest Posts Search Help Subscribe

JS, CSS and/or PHP problem with a:hover

Page: 1 Reply
Jun 8th 2006#173283 Report
Member since: Feb 7th 2002
Posts: 1564
Hey...The Server Side Code section seems gone... Can I post this here ?
Thanks ;)...Hehe, nobody told me not to...

Ok, sorry for possible disturbence

I have a problem that I can't solve as it is a PHP one (It hink). Had this only been a CSS thing I think I've solved it. Ok I have this "top downloads" script going on my site where the top 5 downloads are listed with a link to their zip file.

Now being there and hovering the link it just changes color, and you really have no idea of what it is, unless you're on the "snews design" page and looking at the designs at the same time you're looking at the listed top downloads, right ? Now I would like for these links to show a thumbnail of the design in question upon hover of the link...get it ?

So, I created a new field in the "download table" in which I insert the url to the specific thumb for each template, right ? But now I'm stuck as to where and HOW I should (if it's possible) add any hover thingy in the code... Any one ? The thumb links is residing in the "thumb" field in the table "download" and the path is "/download/iamge.jpg"... the code for the "top 5 downloads" is this:

[PHP]
$query = "SELECT * FROM download ORDER BY downloads DESC LIMIT 5";
$result = mysql_query($query);
while ($r = mysql_fetch_array($result)) {
echo "".$r['title']." (".$r['downloads'].")
";
}
?>[/PHP]
Is there any way of making the links getting the (?) "$r['thumb']." on hover ???

Does anyone even understand what I'm trying to do, hehe - Patric.
Reply with Quote Reply
Jun 8th 2006#173286 Report
Member since: Apr 24th 2003
Posts: 1977
I dont have the time right now to completely understand the question/code, but I think your looking for something like :

[code]
a href="your link" onMouseOver="showthumb(".$r['thumb'].")" onMouseOut="destroythumb()">your link a
[/code] (dont trust that code, just an example lol)

so when you mouse over, you call a javascript function showthumb(url) passing your DB data. Then the function just displays/creates a div with your image where the cursor is. On mouse out you would call the destroythumb() function to hide the div.

In the destroy function, you may also want to check that the div your getting rid of is valid or visible, if not exit the routine. You may not need to, its just error checking.

Hopefully some of that makes sense lol.
Reply with Quote Reply
Page: 1 Back to top
Please login or register above to post in this forum