$ .scrollTo不适用于position:fixed; [英] $.scrollTo doesn't work with position:fixed;

问题描述

我有一个带有面板的jqm页面.我希望面板滚动到某个位置. 使用$ scrollTo插件可以使用，但是它可以同时滚动面板和页面本身.

I have a jqm page with a panel. And I want the panel to scroll to a certain position. Using the $scrollTo plugin works, but it scrolls both the panel and the page itself.

$('#myPanel').on('panelopen',PanelOpen)
function PanelOpen(myEvent, myUI ) {
    $.scrollTo('#ID498',1000)
}

这是我的示例，显示了它滚动面板(万岁) ，以及页面(boo).

Here's my example showing it scroll the panel (hooray), and the page (boo).

现在，从此SO线程，我能够使面板可滚动:

Now, from this SO thread, I was able to make the panel scrollable:

#myPanel .ui-panel.ui-panel-open {
    position:fixed;
}
#myPanel .ui-panel-inner {
    position: absolute;
    top: 1px;
    left: 0;
    right: 0;
    bottom: 0px;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
}

但是现在$ .scrollTo插件不起作用.这是我的第二个示例，这次是面板可滚动的，但是我不能再使用JavaScript定位它.

But now the $.scrollTo plugin doesn't work. Here's my second example, this time with the panel scrollable, but I can no longer position it using JavaScript.

推荐答案

我认为您只需要在内部面板div上调用scrollTo()即可，实际上它设置为溢出并且可以正常工作:

I think you just need to call the scrollTo() on the inner panel div which is actually set to overflow and it will work:

function PanelOpen(myEvent, myUI ) {
    $("#myPanel .ui-panel-inner").scrollTo('#ID498',1000)
}

这是一个正常工作的 ="a href =" http://jsfiddle.net/ezanker/96Smp/"rel =" nofollow>演示

Here is a working DEMO

这篇关于$ .scrollTo不适用于position:fixed;的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！