Jump to content

Dont Want To See Thumb


jnf555
 Share

Recommended Posts

hi can anyone show me how to make the small img not be seen when i click or mouseover it.it shows me he large img which is what i want but i dont want the small img to be on top.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><title></title><head><link href="test.css"rel="stylesheet"type="text/css"><script type="text/javascript">function showme(href){document.getElementById("specimen").src=href;return false;}</script></head><body><center><div id="container"><div id="middle"><div><img src="galleryword3.png" alt="galleryword3" width="800" height="500"id="specimen"class="off"><div><a href="galleryword3.png" onclick="return showme(this.href)" onmouseover="return showme(this.href)"></a></div></div><div style="position:absolute;top:0px;left:0px"><a href="Toco Toucan.jpg" onclick="return showme(this.href)" onmouseover="return showme(this.href)"><img src="Toco Toucan.jpg" alt="picture1" width="100" height="80" /></a></div></div></div></body></html>thanks jnf555

Link to comment
Share on other sites

body{background-image: url(background2.png);}img.off { position: absolute; top: -5000;}.b{background-color:black;}#container{width:1000px;height:1000px;border: 1px solid black;position:relative;}#middle{margin-top:50px;width:800px;height:500px;background-color:silver;position:relative;}i am not really takeing much off css seperate sheet, but i have posted it for you to look ati am glad of your help, thanks jnf555

Link to comment
Share on other sites

thanks for your help jklothi have done as you said, but the problem now is the thumb goes behind the img before i mouseover it, i think if i can remove the destination img(galleryword3.png) it may work but i tried that and it stopped the mouseover working, so i am not sure how to make the z-index work after the full size img as been mouseover'edthankjnf555

Link to comment
Share on other sites

What exactly is it you're trying to do?Upon reviewing your post again here is my understanding:You have a thumbnail gallery of images and when you hover on the thumbnails you want the full size image to pop up in place of the thumbnail.Is this correct?

Edited by jkloth
Link to comment
Share on other sites

I'm not sure what the problem is. I just copied your code to a test page, and it seems to be working like (I think) you want it to.There is a pane on the left with thumbnails, and a pane on the right with the large image. Hovering on a thumbnail displays the large version in the right pane.Do you want it to cover the thumbnails? Then there's no way (that I know of) to change the image back short of refreshing the page.

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
 Share

×
×
  • Create New...