i am currently creating an ipad app using the slablet template.
i have customised it so i have a left navigation and a main window.
i have implemented some ajax so that when a user clicks a link on the left navigation, the page that has been selected appears in my main window. this works fine.
i now want to include some jqtouch so that when, when a user clicks one of the links from my left navigation, the page appears in my main window but with an animation like slidein, slideup, pop etc.
how can i do this??
any help will be greatly appreciated
thanks
i have included some of my code below:
Navigation links:
home
Latest News
Important Uploads
Personal Details
Timetable
Tasks
Staff Lookup
University Informtion
ajax that makes pages load in window:
$(document).ready(function(){ // load index page when the page loads $("#main_content_inner").load("home.html");
$("#home").click(function(){ // load home page on click $("#main_content_i开发者_运维问答nner").load("home.html");
}); $("#latest").click(function(){ // load contact form onclick $("#main_content_inner").load("latest.html"); }); $("#important").click(function(){ // load contact form onclick $("#main_content_inner").load("important.html");
}); $("#personal").click(function(){ // load contact form onclick $("#main_content_inner").load("personal.html");
}); $("#timetable").click(function(){ // load contact form onclick $("#main_content_inner").load("timetable.html");
}); $("#tasks").click(function(){ // load contact form onclick $("#main_content_inner").load("tasks.html");
}); $("#staff").click(function(){ // load contact form onclick $("#main_content_inner").load("staff.html");
}); $("#university").click(function(){ // load contact form onclick $("#main_content_inner").load("university.html"); }); });
jqTouch (and jQuery mobile) are both optimized for phones and don't support independently scrolling areas that you normally see on tablets. If you want that you'll need to go Sencha Touch (my project) or an equivalent.
精彩评论