1

I have a great issue with data-transition of a a tag. Sometimes when i'm clicking on the a tag it goes with the right transition back(right to left), but sometimes it goes from left to right. This is my back button(a tag):

<a href="#account" data-direction="reverse" data-role="button" data-inline="true" data-icon="arrow-l" data-transition="slide" data-iconpos="notext" data-rel="back"></a>

HTML structure:

<!-- #account -->
<div data-role="page" id="account">
    <div data-role="panel" id="panel_menu" data-display="reveal"></div>
    <div data-role="header" data-position="fixed">
        <div class="ui-btn-left">
            <a href="#panel_menu" data-display="push" data-role="button" data-inline="true" data-icon="home" data-iconpos="notext"></a>
        </div>
        <h3>Account</h3>
        <div class="ui-btn-right">
            <a href="" id="logout" data-role="button" data-theme="r">Logout</a>
        </div>
    </div>
    <div data-role="content"></div>
</div>
<!-- #shop -->
<div data-role="page" id="shop">
    <div data-role="panel" id="panel_menu" data-display="reveal"></div>
    <div data-role="header" data-position="fixed">
        <div class="ui-btn-left">
            <a href="#panel_menu" data-display="push" data-role="button" data-inline="true" data-icon="home" data-iconpos="notext"></a>
            <a href="#account" data-direction="reverse" data-role="button" data-inline="true" data-icon="arrow-l" data-transition="slide" data-iconpos="notext" data-rel="back"></a>
        </div>
        <h3>Shop</h3>
    </div>
    <div data-role="content">
        <ul data-role="listview" data-inset="false" id="listview_shop"></ul>                
    </div>
</div>
<!-- #shop_details -->
<div data-role="page" id="shop_details">
    <div data-role="panel" id="panel_menu" data-display="reveal"></div>
    <div data-role="header" data-position="fixed">
        <div class="ui-btn-left">
            <a href="#panel_menu" data-display="push" data-role="button" data-inline="true" data-icon="home" data-iconpos="notext"></a>
            <a href="#shop" data-direction="reverse" data-role="button" data-inline="true" data-icon="arrow-l" data-transition="slide" data-iconpos="notext"></a>
        </div>
        <h3>Shop details</h3>
    </div>
    <div data-role="content"></div>
</div>

When I'm clicking in the shop_details on the back button it slides in the right way.. But when I'm clicking in the shop on back it slides in the wrong way..

Thanks in advance for your help

4

1 回答 1

1

data-rel="back"从此按钮中删除属性：

<a href="#account" data-direction="reverse" data-role="button" data-inline="true" data-icon="arrow-l" data-transition="slide" data-iconpos="notext" data-rel="back"></a>

data-rel="back"会将您返回到上一页，在这种情况下，它会将您从 page shop返回到 page shop_details。

工作示例：http: //jsfiddle.net/mdr3E/

于 2013-07-22T07:27:59.343 回答