0

I would like to let images popup in the center of the screen, when I hover over a thumb. I have multiple thumbs and I all want them to display a div (which includes text and an image) right in the center of the screen, independent from the screen resolution etc. etc.

<a href="#thumb"><img src="img/thump_5.png" width="150px" border="0" /><span><b>some info and image 1</b><br><img src="img/5.png" width="510" height="335" /></span></a>
<br>
<a href="#thumb"><img src="img/thump_2.png" width="150px" border="0" /><span><b>some info and image 2</b><br><img src="img/2.png" width="510" height="335" /></span></a>
<br>
<a href="#thumb"><img src="img/thump_3.png" width="150px" border="0" /><span><b>some info and image 3</b><br><img src="img/3.png" width="510" height="335" /></span></a> 
<br>
<a href="#thumb"><img src="img/thump_4.png" width="150px" border="0" /><span><b>some info and image 4</b><br><img src="img/4.png" width="510" height="335" /></span></a>
<br>
<a href="#thumb"><img src="img/thump_1.png" width="150px" border="0" /><span><b>some info and image 5</b><br><img src="img/1.png" width="510" height="335" /></span></a>

I bumped into this question: Using jQuery to center a DIV on the screen

But I have no clue how to implement this in my html code. Can anyone help me out with the css / jquery to get it working. Regards,

Matthijs

Community
  • 1
  • 1
user369122
  • 792
  • 3
  • 13
  • 33

2 Answers2

1

This might be exactly what you are looking for:

These are not exactly centering a div in the middle of the screen but they look good too ;)

SebScoFr
  • 881
  • 1
  • 9
  • 24
0

Without any code it is hard to give you an allaround answer, but in css terms when you have define a div's width and height attributes to some concrete values (not auto) and then do position:relative; margin: auto;, then the div should center within it's parent. If you want a more extensive answer do a fiddle of what you already have.

jakee
  • 18,486
  • 3
  • 37
  • 42
  • Although this is not the only way to do this and won't work too well if you have other content within the same parent element – jakee Jun 13 '12 at 08:55
  • I indeed have more content in the same parent. So, this will not work. But thanks. – user369122 Jun 13 '12 at 09:33