Monday, August 31, 2009

jQuery - Center a div or any control

Here is a short code to centralize your div or any html control using Jquery..
Dependency could be jquery-1.3.2.js

$('#divid').css('top',$(window).height()/2 - $('#divid').height()/2 + $(window).scrollTop());
$('#divid').css('left',$(window).width()/2 - $('#divid').width()/2 + $(window).scrollLeft());

You can use animate to get some effect to the moving operation.

$('#divid').animate({top: $(window).height()/2 - $('#divid').height()/2 + $(window).scrollTop()},500);
$('#divid').
animate({left: $(window).width()/2 - $('#divid').width()/2 + $(window).scrollLeft()},500);

No comments:

Post a Comment