Jquery移动页面无法扩展,可折叠

时间:2013-04-16 09:03:57

标签: javascript html css cordova jquery-mobile

我有一个jquery移动应用程序,其中有一个可折叠的div。

当我点击此可折叠时,它会打开,但页面高度保持在100%,这意味着我无法向下滚动并查看其中的内容。

我认为jquery mobile是打算在打开这样的东西时调整页面高度?

<div id="hints" class="main" data-role="page" data-theme="a">
    <div data-role="content" id="content">
         <h2>Hints &amp; Tips</h2>
         <p>Helping you get the most out of ARMA 3</p>
         <div data-role="collapsible" data-theme="e" data-content-theme="e">
             <h4>Launch Paramaters</h4>
         </div>
    </div>
</div>

如果可能的话,我真的很喜欢CSS修复而不是JS修复,因为这不应该需要JS。

我试过了:

* {
    min-height:100% !important;
}

* {
    min-height:auto !important;
}

似乎影响它的CSS是:

.ui-panel{
border:1px solid #333;
background:#111;
color:#fff;
font-weight:bold;
text-shadow:0 -1px 0 #000;
background-image:-webkit-gradient(linear,left top,left bottom,from( #3c3c3c ),to( #111 ));
background-image:-webkit-linear-gradient( #3c3c3c,#111 );
background-image:-moz-linear-gradient( #3c3c3c,#111 );
background-image:-ms-linear-gradient( #3c3c3c,#111 );
background-image:-o-linear-gradient( #3c3c3c,#111 );
background-image:linear-gradient( #3c3c3c,#111 )
}

2 个答案:

答案 0 :(得分:1)

我终于找到了问题,这是由于这段代码:

.ui-panel{
    border:1px solid #333;
}

如果有人能解释为什么会导致这个问题,我们将不胜感激!

答案 1 :(得分:-1)

你的问题很奇怪,这不应该发生。 您是否修改了页面的任何CSS或样式属性? (比如定义一个固定的高度等)。