相关疑难解决方法(0)

在过去的一天里,我一直试图弄清楚如何在移动Safari中查看时更改jQuery移动页面上的最小高度样式.我试过,内联样式,覆盖ui页面样式,还没有找到一种方法来覆盖data-role ="page"的高度.理想情况下,如果页面"内容"小于"页面"高度,我希望"页面"高度自动调整为"内容".我附上了一个插图,以便更好地解释这个问题.

<div data-role="page">
     <div data-role="header">
             Header Elements
     </div>
     <div data-role="content" class="homeNav">
            <ul data-role="listview" data-inset="false" data-filter="false">
                <li><a href="expertise.html">Expertise</a></li>
                <li><a href="greatesthits.html">Greatest Hits</a></li>
                <li><a href="profile.html">Profile</a></li>
                <li><a href="mindset.html">Mindset</a></li>
                <li><a href="connect.html">Connect</a></li>
             </ul>  
     </div><!-- /content -->

     <div data-role="footer" data-position="fixed">
             Footer elements
     </div><!-- /footer -->
</div><!-- /page -->

无法找到一种方法来为我的旧问题提供赏金,所以我重新发布它,因为它可能是一个错误.

简短版本:我希望PhoneGap + JQM应用程序中的持久标头在页面转换之间保持原位(从不移动),就像页脚可以设计的那样.

长版:首先,我是jQuery和JQM的新手,所以请指出我所犯的任何新错误.

我正在尝试在应用程序中的不同页面之间保留一个标题.当用户在页面之间转换时,它必须像持久的页脚一样保持在原位.使用data-role ="footer"data-id ="(某些一致的id)"data-position ="fixed"来实现持久页脚.它运作得相当好(随机故障,因为它错位,然后在几秒后自动修复).有关我正在寻找的内容的更多信息,请参阅此处的"持久页脚":http: //jquerymobile.com/test/docs/#/test/docs/toolbars/docs-footers.html

并在下面的链接中查看持久页脚的示例.了解如何选择页脚中的项目转换为全新页面,但页脚不会移动:http: //jquerymobile.com/test/docs/#/test/docs/toolbars/footer-persist-a.html

现在我正在尝试做同样的事情,但我希望它在应用程序的顶部而不是底部.我尝试过以下的事情:

• 将页脚移动到页面顶部(不知道jQuery中要捕获的标记.尝试使用几个jQuery类的div.(jQuery类),但没有一个工作.我使用FireBug来确定它是"顶级"CSS属性需要改变.

每页上的HTML:

<div data-role="footer" data-position="fixed" data-id="header">
<img src="images/bgheader.png" />
</div>

JavaScript:

$('div.ui-footer').css('top', '0px');
$('div.ui-footer-fixed').css('top', '0px');
$('div.fade').css('top', '0px');
$('div.ui-fixed-overlay').css('top', '0px');
$('div.ui-bar-a').css('top', '0px');

• 使用data-role ="header"(不像页脚那样持久).这个方法将创建我想要的标题(因为我覆盖了一些CSS),但是当我在页面之间转换时,它不会将标题保持在顶部.JQM文档也没有声明它们支持持久标头,而它确实声明它支持持久页脚:

每页上的HTML:

<div data-role="header" data-position="fixed" data-id="header" id="header" data-backbtn="false">
<img src="images/bgheader.png" />
</div>