需要使用JQtouch帮助的iPad应用

Question

所以基本上这是我第二次尝试使用jquery和jqtouch创建ipad应用程序（请参阅我的其他问题）

我现在想知道如何将使用一个窗口的iphone即时可用的jqtouch主题应用程序拆分为两个窗口。 所以它更适合ipad

因此，当用户访问该页面时，导航将在左侧，而我将拥有一个主窗口。

当用户单击左侧的导航链接时，div信息将显示在右侧的主窗口中，而过渡动画仅发生在主窗口中，并且导航保持不变。

到目前为止，页面上显示的所有菜单链接都已显示，单击菜单链接后，mennu链接就会向左滑动以显示所选的链接。

我希望菜单链接位于左侧，当单击菜单链接时，选定的链接将显示在右侧的窗口中，并带有漂亮的跨动画效果。

谁能帮我？？？？？？ 请？

任何答复将不胜感激。

我不确定是否允许链接，但我想使其看起来像这样：

http://en.myfreeweb.ru/designing-an-ipad-web-application-with-jqtouc

到目前为止看起来如何：

我的jQtouch网站@import“ jqtouch.css”; @import“ theme.css”;

    <script type="text/javascript" charset="utf-8">
        var jQT = new $.jQTouch({
            icon: 'jqtouch.png',
            addGlossToIcon: false,
            startupScreen: 'jqt_startup.png',
            statusBar: 'black'
        });
    </script>
</head>
<body>
    <div id="page1">
        <div class="toolbar">
            <h1>CISM Diary App</h1>
        </div>
        <ul class="edgetoedge">
            <li><a class="pop" href="#page2">Latest News</a></li>
            <li><a href="#page3">Important Uploads</a></li>
            <li><a href="#page4">Personal Details</a></li>
            <li><a href="#page5">Timetable</a></li>
            <li><a href="#page6">Tasks</a></li>
            <li><a href="#page7">Staff Lookup</a></li>
            <li><a href="#page8">University Information</a></li>
        </ul>
    </div>
    <div id="page2">

        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>Latest News</h1>
        </div>
        <div class="info">
            Hello this is page one huiphguipghuipbuytbouybtouokhjpoinugbougnouygnou
        </div>
    </div>
    <div id="page3">
        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>Important Uploads</h1>
        </div>
        <div class="info">
            Hello this is page two
        </div>
    </div>
    <div id="page4">
        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>Personal Details</h1>
        </div>
        <div class="info">
            Hello this is page three
        </div>
    </div>
    <div id="page5">
        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>Timetable</h1>
        </div>
        <div class="info">
            Hello this is page th
        </div>
    </div>
    <div id="page6">
        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>Tasks</h1>
        </div>
        <div class="info">
            Hello this is page three
        </div>
    </div>
    <div id="page7">
        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>Staff Lookup</h1>
        </div>
        <div class="info">
            Hello this is page three
        </div>
    </div>
    <div id="page8">
        <div class="toolbar">
            <a href="#" class="back">back</a>
            <h1>University Information</h1>
        </div>
        <div class="info">
            Hello this is page three
        </div>
    </div>

</body>

Answer 1

我认为您应该看一下JQTouch的这一分支-它具有ipad样的布局，已预先内置到CSS中。 因此，它的窗格布局在左侧-主窗口在右侧。 还集成了iScroll，可在窗格内部平滑滚动。

如果您已经使用过原始的JQTouch，则JQTouch的此fork很容易使用。 请参阅此处的Beedesk前叉和演示：

https://github.com/beedesk/jQTouch

需要使用JQtouch帮助的iPad应用

问题描述

1 个解决方案

解决方案1
0 2011-03-06 12:25:17

需要使用JQtouch帮助的iPad应用

问题描述

1 个解决方案

解决方案1 0 2011-03-06 12:25:17

解决方案1
0 2011-03-06 12:25:17