1

我正在尝试使用Overthrow插件,它是用于移动设备上的溢出:自动的 polyfill。样品在这里

我的问题:
如何检测div.element可滚动的滚动启动/滚动停止?这是否可能,或者滚动/滚动启动/滚动停止事件仅适用于$(document)

具体来说,如果我的页面上有两个面板,它们都是可滚动的,有什么办法可以使这项工作:

 $(document).on('scrollstart','div:jqmData(panel="main"), div:jqmData(panel="menu")'), function() {
    console.log("scroll detected");
    });

编辑:
我的 HTML 如下所示:

<html class="ui-popover-mode">
// OR depending on screen size
<html class="ui-splitview-mode">
   // panel 1
   <div data-panel="main" class="ui-panel">
       <div data-role="page" class="ui-page" id="mainOne">
           <div data-role="content" class="ui-content"></div>
       </div>
       <div data-role="page" class="ui-page" id="mainTwo">
           <div data-role="content" class="ui-content"></div>
       </div>
   </div>
   // panel 2
   <div data-panel="menu" class="ui-panel">
       <div data-role="page" class="ui-page" id="menuOne">
           <div data-role="content" class="ui-content"></div>
       </div>
       <div data-role="page" class="ui-page" id="menuTwo">
           <div data-role="content" class="ui-content"></div>
       </div>
   </div>
   // panel 3
   <div data-panel="pop" class="ui-panel">
       <div data-role="page" class="ui-page" id="popOne">
           <div data-role="content" class="ui-content"></div>
       </div>
       <div data-role="page" class="ui-page" id="popTwo">
           <div data-role="content" class="ui-content"></div>
       </div>
   </div>
</html>

屏幕模式根据屏幕尺寸设置。在每个面板中可以有多个页面,每个页面都有一个内容部分,可以使用翻转滚动。

我想绑定到splitview -mode的 main 和 menu content 部分中的scrollstart 和popover-mode 的main content 部分。

最初我的选择器试图捕获这一点,并且只附加到相关的内容元素:

$(document).on('scrollstart','.ui-splitview-mode div:jqmData(panel="main") .ui-content,  .ui-splitview-mode div:jqmData(panel="menu") .ui-content, .ui-popover-mode div:jqmData(panel="main") .ui-content, ', function() {
        // do sth
    });

同意这很复杂,没有用。但它只将事件附加到必要的元素上。现在我这样做:

$('.ui-content').on('scrollstart', function() {
        // check here if .ui-content is on the correct panel
    });

所以我现在有很多不必要的绑定,并且只在检测到事件后检查绑定是否正确,而另一种方式我只会将事件附加到所需的元素。

这就是我想知道的。

4

1 回答 1

1

您可以直接选择元素并附加滚动事件。简单的例子

$("#selector").on('scrollstart', function() {
    //...do stuff
});
于 2012-04-15T10:58:23.710 回答