I have made an image gallery in HTML5, JavaScript and CSS by using jQuery mobile. IE Phonegap platform ok. The images are coming dynamically and are loaded in it, like this: http://torontographic.com/wordpress/mouseSwipe/mouseSwipe.html
Above mouseSwipe Slider:
TYPE: 'mouseSwipe'HORIZ: true
plugin available at
torontographic.wordpress.com
The problem coming with it is that I cannot click on the image and go to next page, because two events are occurring together.
The second problem is that I cannot swipe the page up down, from the place where gallery is placed, except the other area where gallery is not present.
To make it more clear, I am making news application in which I have added 5 - 10 gallery like Pulse news application.
It looks like the issue you are experiencing with your image gallery is that the click and swipe events are conflicting with each other. One way to solve this issue would be to use the preventDefault method to prevent the default behavior of the click or swipe event from occurring.
For example, you can use the following code to prevent the default behavior of the click event on the images in your gallery:
$('#my-image-gallery').on('click', 'img', function(event) { event.preventDefault(); // Your code to go to the next page or perform some other action goes here });To prevent the default behavior of the swipe event, you can use similar code, replacing the click event with the swipe event and adding a handler function to process the swipe event:
$('#my-image-gallery').on('swipe', function(event) { event.preventDefault(); // Your code to handle the swipe event goes here });