如何計算2個元素之間的距離，像這樣？

Question

如何計算2個元素之間的距離，像這樣？

我想id="element_bottom"和id="ref_box"

之間計算距離，這是mouse和id="element_bottom"

之間的計算距離小提琴我怎麼可以把這個代碼計算距離id="element_bottom"和id="ref_box"之間？

三江源

http://jsfiddle.net/t5Kts/808/

(function() { 

    var mY, distance_bottom, 
     $distance_bottom = $('#distance_bottom span'), 
     $element_bottom = $('#element_bottom');    

    function calculatedistance_bottom(elem , mouseY) { 
     return Math.floor(Math.sqrt(Math.pow(mouseY - (elem.offset().top+(elem.height()/2)), 2))); 
    } 

    $(document).mousemove(function(e) {   
     mY = e.pageY; 
     distance_bottom = calculatedistance_bottom($element_bottom , mY); 
     $distance_bottom.text(distance_bottom);   
    }); 
})(); 

Answer 1

假設爲距離您引用的每個元素的上衣，你可以試試這個：

DEMO

(function() { 
    var btm = $('#element_bottom'), 
     ref = $('#ref_box'), 
     refTop = ref.position().top; 


    $(window).scroll(function(){ 
     var btmTop = btm.position().top; 
     $('#distance_bottom span').text(Math.abs(refTop-btmTop)); 

    });  

})(); 

Answer 2

像這樣的事情也許應該這樣做：

$('.foo').offset().top - $('.bar').offset().top