Moving a div to bottom of screen

I have managed to get a div containing an image to move down the screen and right by a number of pixels. What I would really like is for this div to move all the way down the screen, no matter what size the screen is so that it rests on the bottom. Can anyone give me any pointers?

$("#div").delay(1000).animate({left: '+=470', top: '+=470'}, 2500);

@Hlforr

Here is a js/jquery function that I use to ensure a left menu is does not go off screen. Similar logic may help you.


function keepMenuLeft(){   var div_width = $("li.hovering div").width();
   var screen_width = $(window).width();
   var offset = $("li.hovering div").offset();
   var left = 0;
   if (offset.left + div_width > screen_width) {
      left = (offset.left + div_width) - screen_width;
      left = 0 -left - 30; //extra 30 (px) account for padding and margins
      left = left + "px";		
      $("li.hovering div.mega_menu").css('left',left);
      $("li.hovering div.mega_menu").css('position','relative');
   } 	
}

You should be able to get the screen height using $(window).height(); and then determine your divs height using $(“some_divs_id”).height. Then you just have to calcultat screen height - div width to give you the point to position the top of your div using css. Use the example above for some reference.

Hope this helps.

Steve

Great, thanks Steve. Yes, that worked.

@Hlforr
Great.

Off Topic:

Your wedding photography blog is awesome, really, really nice composition, lighting, creativity,…

Steve

Off Topic:

Thanks Steve, but regret to say these aren’t my images, I am just the web designer - and priveleged to be so when I can work with photographs like these :slight_smile:

Off Topic:

Well in any case nice site design… not your typical use of colour or blocking but comes off quite well.