Swiping to change scene

Im trying to create a slideshow where my users can slide left or right to go to the previous/next image. (Each picture is a different scene)
I’ve tried the onDrag control, but it only allows me to manipulate the timeline. Is there a Javascript i could use to complete this?

Thanks for all your help in advance!

Hi @wadhi,

You could use jQuery with something like

$("your element id").on("swipe", function () {
//code you want to happen here
});

Instead of "swipe" which reacts to left and right horizontally you could change it to "swipe left" or "swipe right"

Hope this helps!

D

EDIT** I forgot to mention that you have to include jQuery mobile library.

Here is a Hype file to show you how it’s done.

swipeable_elements.zip (48.6 KB)

Hi DBear,

First, thanks for your advice, but Im not to good with jQuery, could you just help me out with this?

I’m assuming this needs to run “On Scene Load”?

$("element id").on("swipe left", function () {
hypeDocument.showSceneNamed(sceneName, optionalTransition, optionalDuration)
    
    });

Thanks so much!

EDIT: Just saw your update, Thanks!

Have you tried using the “On Swipe …” functions in the “Scene Inspector”?

2 Likes

Hi Greg,

I didn’t notice that earlier, Thanks!

Since my entire scene is just the picture, it works fine.

Thanks once again!

1 Like

That would be much easier! :slight_smile: However it’s good to know that you can call different actions with good’ ol jQuery.

1 Like

3 posts were split to a new topic: Swipe Conflicts with Scrolling