0

我有以下

<body>
    <div class="sidebar"></div>
    <div class="main">

        <div class="page-1">
            <p>Page 1</p>
            <button id="btn-page2">Go to Page 2</button>
        </div>

        <!-- Other Pages --> 
        <div class="page-2">
            <p>Page 2</p>
        </div>

    </div>


</body>

我试图通过将所有页面都放在一个 HTML 文档中来遵循 JQuery mobile 的相同原则。

在页面加载时,只应显示具有 page-1 类的 div。但是,单击 ID 为 btn-page2 的按钮时,应显示第二页而不是第一页。

我想我可以在可见页面上添加一个 .active-page 类,并将 display:block 作为属性。

但是,我也想从底部平滑地滑动第二页。

有什么建议么?

4

2 回答 2

0

您可以创建一个 css3 类,该类将从底部滑动任何页面并根据单击的按钮将其添加到页面 div

于 2013-09-24T10:09:01.900 回答
0

你可以看看这个博客。

http://mindfiremobile.wordpress.com/2013/07/16/smooth-page-transition-on-mobile-devices-within-single-html-page/

这演示了使用 css3 添加幻灯片页面效果的方法。

您可以使用相同的概念使页面幻灯片从下到上。

于 2013-09-24T10:08:13.333 回答