Cloud Carousels and iPad / iPhone

Question

Really love this carousel: http://www.professorcloud.com/mainsite/carousel.htm

It works exactly as I need to demonstrate, except that I need to add touch / wipe events for it for iOS and Android.

Basically, if the user wipes (is this the correct terminology?) Left or right, the carousel moves in that direction, as if you were pressing the left or right button.

I studied this plugin: http://plugins.jquery.com/project/Touchwipe-iPhone-iPad-wipe-gesture

And then tried to tweak the carousel plugin to listen to these events

$(container).bind('touchwipe',this,function(event){
   wipeLeft: function() { alert("left"); }
});

But this generates a syntax error. I don’t know enough about creating plugins to find out what is allowed here.

From what I can say in the plugin, the left / right scroll function is here

    // Setup the buttons.
    $(options.buttonLeft).bind('mouseup',this,function(event){
        event.data.rotate(-1);  
        return false;
    });
    $(options.buttonRight).bind('mouseup',this,function(event){                                                         
        event.data.rotate(1);   
        return false;
    }); 

So, I suppose I need to connect to them.

Should I use an additional plugin to create cleanup events, or should I try official touch events?

Thank!

Answer 1

This code works for me

    $(container).bind('swiperight', this, function(event, ui)
    {
        event.preventDefault();
        event.data.rotate(-3);
    });

    $(container).bind('swipeleft', this, function(event, ui)
    {
        event.preventDefault();
        event.data.rotate(3);
    });

Remember to add jQuery mobile to http://jquerymobile.com/

Answer 2

go to http://www.albanx.com/?pid=5&subid=18 and download the version that I adapted for touch (which also works for PC). See the source code if you want to see the details. Hope helps

Answer 3

iScroll .

http://cubiq.org/iscroll-4

http://developer.apple.com/library/safari/#documentation/UserExperience/Reference/TouchEventClassReference/TouchEvent/TouchEvent.html#//apple_ref/doc/uid/TP40009358