Question

Lets say I have a 3 column <table> or <div> with widths of 50% 200px and empty

I want to use jQuery to animate a off screen element into view with it’s ending location being relative to the left edge of the 2nd column.

So say I am viewing page on a large screen and the edge of the second column is 900px from the left side of the window. I want the animation to stop 100px from the edge of the 2nd column so at 800px from the left

However the page might be viewed on a smaller screen. So the stopping location might end up being… 400px from the left.

How do I get the location of the side of a element and then apply it to my animation?

Answer 1

Use offset().

var left = $(".middlecolumn").offset().left + $(".middlecolumn").width() - 100;
$(".animatedblock").animate({ left: left });