Css Pop-up Image Viewer - Center On Monitor

[NoClue]

I'm using the CSS Pop-up viewer and I'm wondering if it is possible to have the image find the center of my monitor. What I mean is when I click on an image I have to move the scroll bar up or down in order to view the image properly.

Is there a code that will tell the image to find the center of my monitor/screen?

The viewer can be found here: http://www.dynamicdrive.com/style/csslibrary/item/css-popup-image-viewer/P80/

Thanks in advance!

[boogyman]

window.screen.width will give you the horizontal screen resolution
window.screen.height will give you the vertical screen resolution

[NoClue]

Thanks Boogyman. But how do I incorporate it in my CSS I've been searching around and trying different things but nothing seems to be working.

Thanks!

[NoClue]

Does anyone know how I can make the image center on the page on pop-up. I've been searching for an answer without luck. Thanks in advance!!


Here's my css:

.minithumbnail{
position: relative;
z-index: 0;
text-decoration: none;
}

.minithumbnail:hover{
background-color: transparent;
z-index: 50;
text-decoration: none;
}

.minithumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #000000;
padding: 5px;
right: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: #ffffff;
text-decoration: none;
white-space:nowrap
}

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

.minithumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -150;
right: 150px; /*position where enlarged image should offset horizontally */
}


Here's the html:

<a class="thumbnail" href="#thumb">
<img src="Shafts_thumb.jpg" width="100px" height="124px" border="0" alt="Shafts"/>
<span><img src="Shafts.jpg" alt="Shafts"/><br />
Shafts</span></a>

[NoClue]

Hi there,

Ok then, since there doesn't seem to be a solution to the monitor question - is there a way to add code to the css that tells it how to display in different browsers, for example, how to display in internet explorer and firefox.

Thanks again!!

[kencredible]

Im having the same problem the script works but on PC IE the images shows much lower than in Firefox PC or Firefox Mac so if i try to raise it higher it then appears off screen everywhere else. Anyone know a fix for this?

[NoClue]

I've been looking all over the internet for solution without luck. One thing that helps is instead of using px to position the pop-up try using %. Although not perfect it made a pop-ups much more aligned in IE and Firefox.

Hope this helps!!

[RbnPhrs]

Im having much of the same problem as OP, but im wondering what it would take to be multiple positions for multiple images using this coding. Im experimenting right now with a couple of methods, but if anyone knows anything the help would be appreciated.