Use Jquery's new Position function in the UI to center anything


/ Published in: jQuery
Save to your folder(s)



Copy this code and paste it in your HTML
  1. Markup:
  2.  
  3. <script src="http://jquery-ui.googlecode.com/svn/trunk/jquery-1.4.2.js"></script>
  4. <script src="http://jquery-ui.googlecode.com/svn/trunk/ui/jquery.ui.position.js"></script>
  5.  
  6. <div id="foo">
  7. My centered foo box
  8. </div>
  9. <script>
  10. $('#foo')
  11. .css({ top: 0, left: 0 })
  12. .position({
  13. my: 'center center',
  14. at: 'center center',
  15. collision: 'fit',
  16. of: window,
  17. using: function(pos) {
  18. var topOffset = $(this).css(pos).offset().top;
  19. if (topOffset < 0) {
  20. $(this).css('top', pos.top - topOffset);
  21. }
  22. }
  23.  
  24. });
  25.  
  26. </script>

URL: hire.chrisjlee.net

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.