jQuery移动标题iphone safari

时间:2012-12-06 03:50:28

标签: iphone jquery-mobile header mobile-safari

我的移动网站有一个非常奇怪的问题。

我在网站上使用jQuery Mobile。它适用于其他设备,但iPhone Safari没有正确显示标题。这是iPhone Safari中的屏幕 -

Safari Screen

应该如下 -

Android Screen

这是我正在使用的标题代码 -

<div data-role="header" data-theme="c" data-tap-toggle="false">

    <div style="height: 40px; border: 0px;" class="ui-header ui-bar-a">

        <a href='#' class='ui-btn-left' data-icon='arrow-l'
            data-direction="reverse"
            onclick="location.href='index.php#mainmenu'; return false;">Back</a>
        <div style="text-align: center;">
            <img src="images/mytechlogy_full_white_text_bigM.png"
                style="width: 200px; padding-top: 5px;" />
        </div>
        <a href="#" class='ui-btn-right' data-icon='home'
            data-iconpos="right"
            onclick="location.href='index.php#mainmenu'; return false;">Home</a>
    </div>

    <div
        style="height: 20px; background: #FF9933; vertial-align: middle; padding: 0px; border: 0px;">
        <span id="page-title"
            style="text-align: left; margin-top: 4px; padding-left: 5px;">My
            Profile</span>
    </div>

</div>

请帮帮我。

1 个答案:

答案 0 :(得分:1)

添加data-position =“fixed”解决了这个问题。

<div data-role="header" data-theme="c"
        style="text-align: center; height: 60px;" data-tap-toggle="false" data-position="fixed">