9

我无法弄清楚这一点。将以下代码放入布局页面并在浏览器中查看后，我将显示 2 个垂直滚动条。

<div data-role="panel" 
     id="mypanel" 
     data-position="right" 
     data-display="push" 
     data-theme="a">       
</div><!-- /panel -->
4

3 回答 3

16

遇到了类似的问题，并注意到仅在使用我的自定义主题时。我以错误的顺序将自定义主题添加到页面，这导致了问题。正确的顺序是：

jquery.mobile.CUSTOM.min.css
jquery.mobile.structure-1.3.1.min.css

希望这对其他人也有帮助。

正如@user812775 所提到的，如果您使用的是自定义主题，您应该只使用 jquery.mobile。结构.css 而不是完整的 jquery.mobile.css

于 2013-04-19T10:56:34.033 回答
2

JQM 代码添加了“min-height: ...”，因此解决方案是将“min-height: 覆盖为 0px。

于 2013-04-04T13:52:56.283 回答
0

在 jquery.mobile-XXXjs 文件中找到这个函数并将最小高度设置为“100%”，如下所示。我发现当它认为面板不适合页面时，它正在尝试更改页面的最小高度，但这样做有时会弄乱您预设的页面大小并导致双垂直滚动条...因此在函数中将其设置为 100% 将使您的页面保持不变，即使 jquery 尝试调整大小（如果您尚未使用 100% 的页面高度，请将其设置为您使用的大小）。

//simply set the active page's minimum height to screen height, depending on orientation
    resetActivePageHeight: function( height ) {
        var page = $( "." + $.mobile.activePageClass ),
            pageHeight = page.height(),
            pageOuterHeight = page.outerHeight( true );

        height = compensateToolbars( page,
            ( typeof height === "number" ) ? height : $.mobile.getScreenHeight() );

        // Remove any previous min-height setting
        page.css( "min-height", "" );

        // Set the minimum height only if the height as determined by CSS is insufficient
        if ( page.height() < height ) {
            page.css( "min-height", "100%" );
        }
    },

如果您使用的是 jquery.mobile-XXXmin.js，这里是您需要更改的功能：

resetActivePageHeight:function(b){var c=a("."+a.mobile.activePageClass),e=c.height(),f=c.outerHeight(!0);b=d(c,"number"==typeof b?b:a.mobile.getScreenHeight()),c.css("min-height",""),c.height()<b&&c.css("min-height","100%")},
于 2015-01-24T05:51:08.103 回答