문서에서 알 수없는 위치에 요소에 애니메이션 적용

Question

메시지 정렬과 같은 몇 가지 정보가 포함되어 있습니다.

이 텍스트를 DOM의 다른 곳에 애니메이션으로 적용해야합니다. 즉, 정확히 (오프셋으로) 텍스트가 시작되거나 애니메이션이 필요한 위치를 알지 못합니다.

Take a look at this 당신이 무슨 뜻인지 볼, div의 순서는 반드시 얻을 것이다 순서 또한

로그 DIV의 크기가 맞지 않습니다 더 많은 메시지가 와서 내가 필요로하는 더 큰 텍스트가 끝날 정확한 지점에 애니메이션을 적용합니다. 그 후 당신이있어 거라면

Answer 1

확실하지 :

$(document).ready(function() { 
    var dx=$('#message').offset().left; 
    var dy=$('#message').offset().top; 
    var ox=$('#log').offset().left; 
    var oy=$('#log').offset().top; 
    $("#log") 
     .css({"position": "absolute","left":ox+"px", "top":oy+"px"}) 
     .animate({"top":dy+"px","left":dx+"px"}, 500, function() { 
      $('#message').text($(this).text()); 
     }); 
}); 

바이올린 - 내가보고했다>http://jsfiddle.net/KhVuS/9/