jquery mobile splitview：支持屏幕的问题

Question

您好，我正在使用 jquery mobile 和 splitview 插件
http://asyraf9.github.com/jquery-mobile/
我无法解决的是为什么 splitview 插件只能在满足以下条件的屏幕上使用。

 var $query = $.mobile.media('screen and (min-width: 480px)') && ($.mobile.media('(-webkit-max-device-pixel-ratio: 1.2)') || $.mobile.media('max--moz-device-pixel-ratio: 1.2)'));
 $.support.splitview = ($query || ($.mobile.browser.ie && $(this).width() >= 480)) && $.mobile.ajaxEnabled;

splitview 插件适用于所有屏幕，但对于不满足上述条件的较小屏幕，存在一些滚动错误。它不能正确滚动。如果不满足这些条件，我们不能修复这些问题而不是完全不使用 splitview 插件吗。
保留这些条件是否有特殊原因？ 请帮忙。

Answer 1

问题似乎出在 jquery.mobile.splitview.css 中的这行 CSS (line:75)

-webkit-overflow-scrolling:touch;

如果您将其注释掉，滚动错误就会消失但 ul 元素没有任何动量。

启用原生动量滚动似乎是 iOS5 的特定规则。请参阅http://johanbrook.com/browsers/native-momentum-scrolling- ios-5/

CSS 修复

使页面滚动动量

#search .ui-content {
 -webkit-transform: translate3d(0, 0, 0);
}

#search-list {
 position:  static;
 overflow:  scroll;
}

#search 是 page-id，#search list 是 ul 元素。但现在看来，向左和向右滑动似乎分别变成了向上和向下滑动。诡异的。

JS 修复（推荐）

在第 527 行，如果 jquery.mobile.splitview.js 进行以下更改

//if ($.support.touch && !$.support.touchOverflow) {
if($.support.touch){

，这会强制运行使用 iScroll.js 的后备代码。

我认为 JS 修复目前效果更好。

注意：这是一个已知问题，这里有一些关于如何解决该问题的建议 - CSS3 属性 webkit-overflow-scrolling:touch ERROR