I am looking for a jquery plugin that navigates to other pages of a website using a sliding animation similar to some iphone apps. I tried designing this on my own but I could not get it to work.
Here is an example of what I need:
(on pressing the button)
Did you have a look at JQuery Mobile? It mimics a lot of the iPhone animations, and it will run on non-mobile browsers as well as mobile browsers. For instance, http://jquerymobile.com/demos/1.1.1/docs/pages/page-transitions.html has a "Slide" transition that you can demo.
You could try sencha touch, never used it personally but appears to do what you want.
Demo: http://dev.sencha.com/deploy/touch/examples/production/kitchensink/#menu/animations
Download: http://www.sencha.com/products/touch/
There's also JQtouch a quick google will find that (as I cant post the link because of low reputation)
Related
There are an increasing number of apps that use UIWebView in the app, like LikeALittle. Instagram's "Notes" view also uses UIWebview, and it behaves stunningly similar to the native view.
What customizations do you need to make to the JS, and are there any best practices or tutorials for achieving a good native-like UX in the UIWebview?
You can try one of the severals framework created with mobile propose, like JQuery Mobile, JQTouch or Sencha Touch.
Have a look at jQuery Mobile
Here is a screenshot from app named Downloads lite, it seems like intergrate safari into it's interface, I guess it just simulate the UI from safari.
I'm trying to use UIWebView to display web page, but I don't know how to implement the bule progress bar background and address bar drap disabled when loading
SVWebViewController is pretty much what you are looking for. Hope it helps...
I am currently using iwebkit and phonegap together. Once everything is compiled and tested on an idevice, I can click a video link and get it to play. It play full screen but it uses the ios web video player (the one that doesn't have the "done" button" and the top and has a bar that spans the bottom of the screen. I can then press the full screen button to have it use the regular ios media player but when i click done from that, it doesn't take me back to the part of the app before the video, it just takes me to the full screen video in the web player. I hope someone can help me solve this and I hope I was able to describe my problem in a clear way. I've spent 2 hours searching and have come up with nothing.
I'm having the same problem. iOS 4.3.x introduced this problem as far as I can tell. There's a few comments about it on Apple's developer site but so far I haven't found any solution. Part of the problem seems to be Phonegap because I experience the exact same thing you describe when running the compiled app. However, if I simply browse to the same HTML pages it seems to work fine. Note - I changed from directly linking to video files to using the HTML5 tag. Using the tag works better than direct linking in Phonegap -- the videos still open in the player but when you click the Done button it returns to where it was. Keep in mind that if you do this the video will be on the inline in the page and paused but when you click the play button it opens in the player. The only problem I've found with this solution is that it won't rotate when you change from portrait to landscape when running in the phonegap app but it does rotate when browsing to the video in mobile safari. Not sure if any of that helps. I would be interested in what you've been able to work out since you posted.
I was working on a protoype using jquery UI resizabel plugin, but I noticed that it doesnt work on the iPad.
Might it be a problem with the touch/click event?
I worked previously with a sliders plugin and they were pretty good on that device so I beleive it is do-able and I wonder how can fix the resizable pluing to make it work on the iPAd too..
Thanks
Another option is http://touchpunch.furf.com/
jQuery UI Touch Punch is a small hack that enables the use of touch events on sites using the jQuery UI user interface library.
i found myself this
http://code.google.com/p/jquery-ui-for-ipad-and-iphone/
I am building a website which provides support on Iphone also. I am using JQTouch jquery library(www.jqtouch.com) which provides multi-touch functionality like swipe, flip, back page.
It would be great to hear from you guys on how to extend zoom-in and zoom-out functionality for photos. Does JQTouch provide any readymade function for the same. Also I would like to hear more on the touch screen functionality that I could use more in my application.
Thanks in advance!
The JQTouch library specifically disables resizing the viewport, so you would not be able to use this for zooming in on photos. See this post which talks about performance, but also mentions that they disable the viewport resizing: http://blog.jqtouch.com/post/205113875/milliseconds-responsiveness-and-the-fast-tap
Normally this effect is achieved by using css techniques or a plugin like this.
You show a small version of an image and on mouse over and move, show a portion of a blown up version.
Here's a good jQTouch extension and demo for pinch, zoom, rotate and very flexible too: http://www.reddit.com/r/iphone/comments/bhkx3/jqtouch_gestures_extension_multitouch_events_and/
Basically you get to combine these events however you want.