468,316 Members | 2,062 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,316 developers. It's quick & easy.

link on pop-up image from thumbnail using css

I am using this css. I have a link from the thumbnail to another page, but need to go to the same link on the pop-up image.

IN STYLES

}


.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightpink;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */

}

IN HTML

<a class="thumbnail" href="http://www.varmintcong.com/plan9.htm"><img src="images/plan9thumbnail.jpg" width="388" height="200" border="0" /><span><img src="images/plan9popup.jpg" /><br />
Plan 9</span></a>

the web page is:

http://www.varmintcong.com

Any help would be much appreciated.

Thanks,
karen
Mar 31 '07 #1
4 2307
I have played with this css from dynamicdrive.com also. Good stuff, I use it on this page pretty often as it is rather light and produces a nice affect. However, i do no beleive you can great links within the pop up. For that I have switched to a java script that does pretty similar things.
Mar 31 '07 #2
Thank you for replying. Can you please post the javascript you mentioned or direct me to a place to copy and paste it into my page.

Thanks
Mar 31 '07 #3
I used some of dynamic drives java script menu stuff then modified it to run some pictures and text. It is pretty much straight up mod done throught xhtml.

you can see it here

http://www.karting101.com/tracks.htm

just hover over a few of the track names.
Apr 2 '07 #4
There is a problem with this bit of code in IE (6.0) where a bug in IE does link to the specified URL on the pop up image. There is a fix by putting a onClick call in the image tag. See the fix here:
http://www.plasticcube.com/blog/2007...nk-workaround/
May 13 '07 #5

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

8 posts views Thread by JimC | last post: by
4 posts views Thread by Roy Smith | last post: by
6 posts views Thread by Will | last post: by
2 posts views Thread by LinusLee | last post: by
13 posts views Thread by Derek | last post: by
14 posts views Thread by Stingray | last post: by
25 posts views Thread by Nicholas Parsons | last post: by
7 posts views Thread by PGPS | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.