Log in

View Full Version : Popup Viewer Area


Cball
04-13-2007, 02:34 PM
Let me explain. On the example given here (http://www.dynamicdrive.com/style/csslibrary/item/css-popup-image-viewer/) the only time the image pops up is when the cursor is directly over the image. However when I implemented this on my site if you get the mouse near the bottom, left or right side of the thumbnail it pop's up which is just an annoyance however I would like to fix it... I just noticed it's not centered using FF but that I can deal with.

Here is My site (http://www.camdentonsoftball.com). The thumbnail I'm referring to is the map on the main page.

Thank you in advance.
jscheuer1
04-13-2007, 04:19 PM
Get rid of this:


a{display:block;color:#981793;padding:10px}

Or, make sure it doesn't apply to the link containing the image (from your source, addition red):


<a class="thumbnail" href="#thumb" style="display:inline;padding:0;">

This will change the layout a little. If you add a <br> after the </a>, that should restore the layout to what you have now.
Cball
04-13-2007, 04:42 PM
Thank you very much...

Again it was totally cosmetic but it sure makes it better..

Thanks again.


Any chance you would know why @ the resolution I run I only have a right scroll bar on the index page but not on any of the others..?
Veronica
04-13-2007, 06:48 PM
In your thumbnail span, change the left margin from -100 to -400:




.thumbnail span{position:absolute;background-color:transparent;padding:0px;left:-400px;border:0;visibility:hidden;color:black;text-decoration:none}



Also, I notice you don't have any body tags, just a close body tag on your pages.
jscheuer1
04-13-2007, 07:05 PM
I think that at a high resolution/wide window, if you mean the vertical scroll bar, you would need to add a negative top coordinate:


.thumbnail span{top:-4000px;position:absolute;background-color:black;padding:0px;left:-100px;border:0px dashed gray;visibility:hidden;color:black;text-decoration:none}

The left margin (as it is) should only affect the presence or absence of a horizontal scroll bar and only in narrower windows.

Veronica's right though, your source code is a bit non-standard.
Veronica
04-13-2007, 07:30 PM
Ooops. I thought the issue was the horizontal scrollbar on the index page. It shows up at 1024x768 pixels. That's what the change in left-margin was supposed to fix.
Cball
04-16-2007, 07:33 PM
Thank you both so much for the help. But Veronica I changed the -100 to -400 and the horizontal bar is still there.. However I can deal with it just was wondering

Also, I'm really new to coding and this is my first site so I'm not sure what you mean other than put a <body> at the beginning of my html.



Veronica's right though, your source code is a bit non-standard.