需要使用JQtouch帮助的iPad应用

Question

so basically this is my 2nd attempt at creating an ipad app using jquery and jqtouch (see my other questions) 所以基本上这是我第二次尝试使用jquery和jqtouch创建ipad应用程序（请参阅我的其他问题）

i am now wondering how i can split the readily available jqtouch theme app for iphone which uses one window - into 2 windows. 我现在想知道如何将使用一个窗口的iphone即时可用的jqtouch主题应用程序拆分为两个窗口。 so it is more suited for the ipad 所以它更适合ipad

so when the user accesses the page, the navigation will be on the left, and i will have a main window. 因此，当用户访问该页面时，导航将在左侧，而我将拥有一个主窗口。

when user clicks a navigation link on the left, the div information appears in the main window on the right with the transition animation only happening in the main window and the navigation remaining un changed. 当用户单击左侧的导航链接时，div信息将显示在右侧的主窗口中，而过渡动画仅发生在主窗口中，并且导航保持不变。

what i have so far, all menu links displayed on the page, when menu link is clicked, mennu links slide to the left to reveal selected link. 到目前为止，页面上显示的所有菜单链接都已显示，单击菜单链接后，mennu链接就会向左滑动以显示所选的链接。

i want menu links to be on left, when menu link is clicked, selected link appears in window on right with nice transistion animation. 我希望菜单链接位于左侧，当单击菜单链接时，选定的链接将显示在右侧的窗口中，并带有漂亮的跨动画效果。

Who can help me?????? 谁能帮我？？？？？？ please? 请？

any reply will be greatly appreciated. 任何答复将不胜感激。

im not sure if links are allowed but i would like to make it look something like this: 我不确定是否允许链接，但我想使其看起来像这样：

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

how it looks so far: 到目前为止看起来如何：

My jQtouch website @import "jqtouch.css"; 我的jQtouch网站@import“ jqtouch.css”; @import "theme.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

I think you should take a look at this fork of JQTouch - which has an ipad like layout prebuilt into the CSS. 我认为您应该看一下JQTouch的这一分支-它具有ipad样的布局，已预先内置到CSS中。 So it has a pane layout on left - and a main window on right. 因此，它的窗格布局在左侧-主窗口在右侧。 Incorporates iScroll as well for smooth scrolling inside panes. 还集成了iScroll，可在窗格内部平滑滚动。

This fork of JQTouch is easy to use if you already have used the original JQTouch. 如果您已经使用过原始的JQTouch，则JQTouch的此fork很容易使用。 See here for the Beedesk fork and demos: 请参阅此处的Beedesk前叉和演示：

https://github.com/beedesk/jQTouch 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