How do I vertcally align thumbnails of unknown height using jQuery?

Posted by playahabana on Stack Overflow See other posts from Stack Overflow or by playahabana
Published on 2010-05-07T20:14:15Z Indexed on 2010/05/07 20:18 UTC
Read the original article Hit count: 188

Filed under:

Ok, I am a complete beginner to this, in fact I am still building my first website. I am attempting to do this all by hand-coding without a CMS in order to try and learn as much possible as quickly as possible. If this post is in the wrong place I apologise, and a pointer to right place would be appreciated.

Here goes, I am trying to peice together a bit of jQuery that will automatically vertically align my thumbnails in my image gallery (they are all different sizes). They are within fixed size div's and the function I am attempting looks something like this:

<script type="text/javascript">

$('#ul.photo).bind(function() {

var smartVert=$(this);

var phty=ob.("ul.photo img").height(); //get height  of photos

var phtdif=Math.floor(208 - phty); //subtract height of photo from div height

var phttop=Math.floor(phtdif / 2); //gets padding reqd.

$ob.("ul.photo").css({'padding-top' : phttop}) //sets padding to center thumbnail

});

smartVert();

unsurprisingly this doesn't work, if some kindly soul could take pity on a total noob, and point out where I am going wrong (probably in writing complete gibberish would be my first guess) it would be greatly appreciated- even if you could just point me in the direcion of a tutorial regarding these things, I have looked and found one reference that said such a function was easy to create, but it did not elaborate.

thankyou in advance

© Stack Overflow or respective owner

Related posts about vertical-alignment