Scroll and table

Question

<div id="main" style="max-width: 65px !important; overflow: scroll"> 
    <table border="1"> 
     <tr><td>a</td><td>s</td><td>d</td><td>f</td><td>g</td><td>h</td><td>i</td><td>j</td><td>k</td><td>l</td></tr>  
    </table> 
​</div>​ 

​td { 
    padding: 15px; 
}​ 


​$('#main').scroll(function(){ 
    console.log($(this).scrollLeft()); 
    //console.log(current TD on left); 
})​​​​​ 

如何在此表中显示左侧的当前元素？对于启动应该是一个，以及未来如果TD与小号是离开了这个表里面那么应该告诉我小号

http://jsfiddle.net/8KLDc/

Answer 1

$('#main').scroll(function() { 

    offset = $(this).offset(); 

    currentElement = document.elementFromPoint(offset.left + 20, offset.top); 

    console.log(currentElement.innerHTML); 
})​;​ 

首先，它找到#main的位置元素在页面上。然后它搜索该位置右侧20px的元素（因为我们需要最靠近中心的单元格）。

例如：http://jsfiddle.net/grc4/8KLDc/2/