iPhone JQuery：如何使用iPhone中的Jquery Mobile +手机差距在iPad中实现拆分视图

时间：2012-05-25 12:16:21

标签： jquery iphone ipad jquery-mobile cordova

我曾尝试使用 split view

来实施 JQuery mobile Phone gap index.html

中的

示例代码

 

    <head> 
        <link rel="stylesheet" href="inc/jquery.mobile.structure-1.0.1.min.css" />
        <link rel="stylesheet" href="inc/jquery.mobile-1.0.1.min.css" />
        <link rel="stylesheet" href="inc/resources/css/jquery.toastmessage.css" />

        <script type="text/javascript" src="inc/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" src="inc/jquery.mobile-1.0.1.min.js"></script>

        <script type="text/javascript" src="inc/phonegap-1.2.0.js"></script>
    </head> 

    <body> 

        <div data-role="page" data-theme="c">
            <div data-role="header">
                Mpbile Split View
            </div>   

            <div data-role="content">

                 <!--- Left side view------>
                <div class="left-content">
                    <h3>lef hand content</h3>
                    <ul data-role="listview">
                        <li>One</li>
                        <li>One</li>
                        <li>One</li>
                        <li>One</li>
                    </ul>
                </div>

                <!--- Right side view------>
                <div class="right-content">
                    <h3>Right hand content</h3>
                    <ul data-role="listview">
                        <li>Two</li>
                        <li>Two</li>
                        <li>Two</li>
                        <li>Two</li>
                    </ul>
                </div>
            </div>
        </div>


    </body> 
</html>

但它显示了同一页面上下两个从上到下的视图，如下图所示

enter image description here

我需要两个表格 split view 左侧一个 （ root view ）和右侧的其他（ details view ）

如何使用jQuery？提前谢谢

3 个答案:

答案 0 :(得分：1)

您可以使用http://jeromeetienne.github.com/jquery-mobile-960/并将其与该网格分开。

如果您了解960.gs或任何其他css网格框架，那么对您来说非常容易。在提到的网站上有使用演示。

答案 1 :(得分：1)

尝试使用我的multiview plugin。

它允许在Jquery Mobile中并排使用1/2/3面板和弹出式面板。我没有尝试使用PhoneGap（刚刚完成JQM 1.1），所以如果你尝试一下，请告诉我它是否有效（我应该猜）。

请使用1.1版本和JQM 1.1.multiview，需要进行一些调整才能正常工作。

我目前正在做新的README和示例站点。应该在几天内完成。

答案 2 :(得分：1)

尝试simplesplitview

http://simplesplitview.sourceforge.net/

它是最好的jquerymobile splitview，该死的易于实现

相关问题
最新问题