CODEWITHSUNDEEP
javascriptiphoneipadjqtouchextjs
Roflcart
Roflcart

Reputation: 41

Simple swipe gallery with jQTouch javascript iphone / ipad

What I wish to achieve is have a simple gallery of images which the user can swipe through using jQTouch ( http://jqtouch.com )

<div id="container">
<img src="1.gif">
<img src="2.gif">
<img src="3.gif">
</div>

The images are quite long, for example 200px in width each. The container itself is 300px wide with hidden overflow.

What I wish to happen is when the user swipes the galley container, it drags the images to the left/right.

So far I have set up the container to receive swipe events and which direction it is in, however to be honest I have completely no idea where to go on from there.

Any advice appreciated.

Upvotes: 3

Views: 19208

Answers (2)

Brad Birdsall
Brad Birdsall

Reputation: 1743

Check out this lightweight mobile slider I just released. Swipe might be able to solve your problem :)

Upvotes: 6

William Niu
William Niu

Reputation: 15853

Have you come across this demo?

"Photo Gallery" and "Photo Gallery 2" may be what you want. And if you just want to have photos and some captions, it should be fairly simple to setup:

jQT.generateGallery("pageID",
    [
    {src:"http://www.site.com/somepic.jpg"},
    {src:"pic1.jpg",caption:"Test Image 1"}
    ],
    {defaultIndex:1}
);

You'll need the the jQT photo extension: jqt.photo.js and jqt.photo.css.

Upvotes: 8

Related Questions