Using swipw events

[Barbara]

I was wondering if you have any examples for using swipe events in app.

I have the following code in my screen load event. When I test on my Samsung Galaxy SII, swiping doesn't work very well, the page will swipe sometimes, but only if I press really hard. Other times it does nothing.

$.mobile.pushStateEnabled = true;

$(function () {
var menuStatus;

Code: Select all

 // Show menu 
 $("a.showMenu").click(function () { 
     if (menuStatus != true) { 
         $(".ui-page-active").animate({ 
             marginLeft: "240px", 
         }, 300, function () { 
             menuStatus = true 
         });                 
$('.ui-footer').addClass('ui-fixed-hidden'); 
         return false; 
     } else { 
         $(".ui-page-active").animate({ 
             marginLeft: "0px", 
         }, 300, function () { 
             menuStatus = false 
         });                 
$('.ui-footer').removeClass('ui-fixed-hidden'); 
         return false; 
     } 
 }); 

 $('#menu, .pages').live("swiperight", function () { 
     if (menuStatus) { 
         $(".ui-page-active").animate({ 
             marginLeft: "0px", 
         }, 300, function () { 
             menuStatus = false 
         });                 
$('.ui-footer').removeClass('ui-fixed-hidden'); 
     } 
 }); 

 $('.pages').live("swiperight", function () { 
     if (!menuStatus) { 
         $(".ui-page-active").animate({ 
             marginLeft: "240px", 
         }, 300, function () { 
             menuStatus = true 
         });                 
$('.ui-footer').addClass('ui-fixed-hidden'); 
     } 
 });         
 $('div[data-role="page"]').live('pagebeforeshow', function (event, ui) { 
     menuStatus = false; 
     $(".pages").css("margin-left", "0"); 
 }); 

 // Menu behaviour 
 $(".rlink").livequery('click', function(event) {     

localStorage['id']=$(this).attr('id');
getrecipese.execute();
/var p = $(this).parent();
if ($(p).hasClass('active')) {
$("#menu li").removeClass('active');
} else {
$("#menu li").removeClass('active');
$(p).addClass('active');
}/
$(".ui-page-active").animate({
marginLeft: "0px",
}, 300, function () {
menuStatus = false
});
$('.ui-footer').removeClass('ui-fixed-hidden');
return false;
});
});

[maxkatz]

You got custom code, plus animate functions with duration. I'd just use a plain swipe event and see how it works. When you create a page in Tiggzi, there is a swipe event.

[Barbara]

How do I call this swipe event?

[maxkatz]

Events Add Event, then add Action.

[Barbara]

Yay. I just took the custom code for the swipe events and it works perfectly - thanks.