1

我的过渡很生涩，有些时间似乎处理了两次。所以它不是从页面到页面的平滑流畅的过渡。我在编码中做错了吗？这是在具有最新更新的 iPhone 4S 上进行的测试。

<div data-role="page" id="track_dash">
    <div data-theme="a" data-role="header" data-position="fixed">
        <h3><!-- ex: Phase 1, Day 1 --> Phase #, Day # </h3>
        <a data-role="button" data-transition="flip" data-theme="b" class="ui-btn-right" href="#page2"> Info </a>
    </div>
    <div data-role="content">
        <div class="360">
            <img src="simgs/360_logo.png" /><!-- style="width: 170px; height: 91px" -->
        </div>
        <ul data-role="listview" data-divider-theme="b" data-inset="true">
            <li data-theme="c">
                <a href="#page4" data-transition="slide"> Track Meals </a>
            </li>
            <li data-theme="c">
                <a href="#page20" data-transition="slide"> Track Workouts </a>
            </li>
            <li data-theme="c">
                <a href="#page8" data-transition="slide"> Track Progress </a>
            </li>
            <li data-theme="c">
                <a href="#page17" data-transition="slide"> Journal </a>
            </li>
        </ul>
        <ul data-role="listview" data-divider-theme="d" data-inset="true">
            <li data-theme="d">
                <a href="#page52" data-transition="slide"> <img src="simgs/alert_bubble.png" alt="Alerts" class="ui-li-icon" /> Alerts <span class="ui-li-count">2</span> </a>
            </li>
        </ul>
    </div>

    <div data-theme="e" data-role="footer" data-position="fixed">
        <div data-role="navbar" data-iconpos="top">
            <ul>
                <li>
                    <a href="#page1" id="track" data-theme="e" data-icon="custom" data-corners="false" data-iconshow="true" data-wrapperels="span" class="ui-btn-active"> <span class="foot_font">Track</span> </a>
                </li>
                <li>
                    <a href="#page40" id="cal" data-theme="e" data-icon="custom" data-corners="false" data-iconshow="true" data-wrapperels="span"> <span class="foot_font">Calendar</span> </a>
                </li>
                <li>
                    <a href="#page44" id="shop" data-theme="e" data-icon="custom" data-corners="false" data-iconshow="true" data-wrapperels="span"> <span class="foot_font">Shopping</span> </a>
                </li>
                <li>
                    <a href="#page22" id="profile" data-theme="e" data-icon="custom" data-corners="false" data-iconshow="true" data-wrapperels="span"> <span class="foot_font">Profile</span> </a>
                </li>
                <li>
                    <a href="#page47" id="more" data-theme="e" data-icon="custom" data-corners="false" data-iconshow="true" data-wrapperels="span"> <span class="foot_font">More</span> </a>
                </li>
            </ul>
        </div>
    </div>
</div>
4

1 回答 1

1

可能是由这个问题引起的- jquery mobile 1.1。当您在标题中设置 data-position="fixed" 时，它尤其明显。该问题有一些答案，请阅读直到最后。

否则，更具体地说，如果您不知道，您需要描述您使用的浏览器或移动操作系统，以及您使用的 jqm 版本。

于 2012-05-24T17:43:29.877 回答