this may sound stupid jquery noob , trying make div tag resize when when swipe left , right on mobile, , not sure why executed once? can jquery gurus here me out !!!! thank you
here code
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script> </head> <body> <div class="box"> </div> <script> $(function right(){ // bind swiperighthandler callback function swipe event on div.box $( "div.box" ).on( "swiperight", swiperighthandler ); // callback function references event target , adds 'swiperight' class function swiperighthandler( event ){ $( event.target ).addclass( "swiperight" ); } }); $(function left(){ // bind swiperighthandler callback function swipe event on div.box $( "div.box" ).on( "swipeleft", swiperighthandler ); // callback function references event target , adds 'swiperight' class function swiperighthandler( event ){ $( event.target ).addclass( "swipeleft" ); } }); </script> </body> </html>
you need remove , add classes
function swiperighthandler( event ){ $( event.target ).removeclass('swipeleft').addclass( "swiperight" ); } and
function swiperighthandler( event ){ $( event.target ).removeclass('swiperight').addclass( "swipeleft" ); } 