Start a new topic

Attach swipe event to page

Hi everyone,

we implemented the swipe functionality of jQuery Mobile by using this library: Swipe Homepage. It is working great but we'd like to attach the swipe events to specific pages. We have a home screen with different tiles - each of them represent another page when you click on it. So how to attach swipe to single pages ?

We tried different things:

a) Implementing it in the global js-header, using $("pageName").swipe( ) for each page. Nothing happens because I guess the header cannot reference to div's because the header is loaded just before.

b) Implementing it in the Homescreen->ajaxSuccess for every page but it's just working for the "home" page.

c) Implementing the swipe event $("pageName").swipe( ) in the press event of each tile. Using this way you click on a tile in the home screen and the app navigates to the next page and you could use the swipe functionality as expected. But you always have to click on the tile first before you can use swipe in the next screen.

Isn't there a better way to build this on a global level and then decide for each page what is going to happen ?

Our problem right now: Navigating between pages without coming from the home screen. That is why we cannot attach the event to the next page.

Anyone here with a good idea ?



(12.5 KB)

Hi Alexander

Can i recommend another solution ? 

The Carousel object already have the swipe left/right event.

Check the documentation on Carousel

Will this object provide the required functionality ?


Ole Andre

Hi Ole-André,

that is a very interesting object and indeed it helps me a lot. Using the carousel object from sap.m it is easy to use to show it. But I'll have to use the carousel from sap.ui.commons ( in order to use vertical swipe functionality. For this object doesn't work. I guess is only valid for controls from sap.m. 

Do you have any idea how to navigate from my home screen "into" the carousel object ?



Hi Alexander

The sap.ui.commons.Carousel object are used in desktop Applications and do not have swiping event, so my recommendation is still using the sap.m.Carousel object.

If you explain your Mobile Application more in detail it would be great for us to assist you.


Ole Andre

Hi Ole,

you are right - the carousel object is not suitable for swiping events. I thought that there might be one as a small mobile version (sap.m) and a bigger one as a desktop version (sap.ui.commons)  also with swiping events included. Well what I actually need is a carousel just like the one from sap.m but with vertical swiping availability. 

The actual idea was to provide horizontal AND vertical swiping possibilities to the user. But obviously there is no easy way to realize something like that. Like I wrote in my first posting we found a way to trigger swiping events for each direction but attaching it to each page became a problem. In my opinion the carousel object from sap.m with only horizontal swiping abilities is a great way to use swiping features in a quick and easy way.

Thanks for offering help!



Login or Signup to post a comment