始终围绕鼠标光标特别DIV在JQuery中

Question

我在网页的中间有一个div “wtb_wrapper_middle”。

对于在网页的div只滚动能。在左侧和右侧div不可移动，它固定在我的网页上。

所以我想鼠标始终专注于特定的div地方是我的鼠标点击或悬停鼠标。意思是当我使用键盘向上或向下按钮时，那个特殊的div只应该滚动。

是否有可能在JQuery中。

我的代码如下所示。

<div id="wtb_wrapper_inner"> 
    <div id="wrapper_left"> 
     .... 
     .... 
     .... 
    </div> 
    <div id="wtb_wrapper_middle"> 
     .... 
     .... 
     .... 
     .... 
    </div> 
    <div id="wtb_wrapper_right"> 
     .... 
     .... 
     .... 
    </div> 
</div> 

从上面的html代码“wtb_wrapper_middle”区域只滚动我的网页。

我曾尝试以下

window.onload = function() { 
    document.getElementById("wtb_wrapper_middle_inner").focus(); 
}; 

在此代码只集中在页面加载，但如果点击鼠标在别的地方，当时也是中部地区应该是滚动。这不起作用。

我的Ajax回调函数像下面

$.ajax({ 
    type: "POST", 
    url: "search.php?ajaxrequest=yes", 
    data: query_string 
}).done(function(data) { 
    $(".wtb_p_loader").remove(); 
    $("#wtb_wm_listing").append(data); 
}); 

我回追加成功的数据为二wtb_wm_listing这是我已经把主div中wtb_wrapper_middle

任何人都帮我使其成功..

Answer 1

为此，您可以使用CSS的位置是：固定; 无论滚动位置如何，两个外部div都固定在屏幕上。然后，无论鼠标指针在哪里，中央div都会滚动。您可以使用顶部和底部固定屏幕的全部高度，然后左右均可固定每一侧。 您仍然可以与固定外部div中的内容进行交互。 和Html是

<div class='left'> 
    <a href='#'>Hover to check the mouse focus and scorll</a> 
</div> 
<div class='center'> 
    //some long content 
</div> 
<div class='right'> 
</div> 

Css为做这个动作。

a { 
    color: #000; 
    display: block; 
    font-family: arial; 
    margin: 10px; 
    text-decoration: none; 
} 

a:hover { 
    background-color: #f03055; 
    color: #fafafa; 
} 

p { 
    color: #fafafa; 
    font-family: arial; 
    line-height: 24px; 
    margin: 0 0 25px 0; 
    padding: 0 2%; 
} 

.center { 
    background-color: #97c; 
    height: 2000px; 
    margin: 0 25%; 
    width: 50%%;  
} 

.left { 
    background-color: #7c9; 
    bottom: 0; 
    left: 0; 
    position: fixed; 
    top: 0; 
    width: 25%; 
} 

.right { 
    background-color: #7c9; 
    bottom: 0; 
    position: fixed; 
    right: 0; 
    top: 0; 
    width: 25%; 
} 

Answer 2

编辑：滤除输入元素

document.body.onkeydown = function(event){ 
    var e = event || window.event, 
    target = e.target || e.srcElement; 

    if (target.tagName.toUpperCase() == 'INPUT') return; 
    document.getElementById("wtb_wrapper_middle_inner").focus(); 
}; 

这将每当​​事件发生焦点移动到你的中间股利。