需要使用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