Control swipe timeline with iframe


(chans) #1

Hello
I make this hype document with swipe a symbol’s timeline.
This is my code, it work perfectly when I click on a button call this javascript but it does not work when I swipe left or right ( with an iframe on background).
Swipe left or right work perfectly if it has not iframe.
I dont know the way to keep it working when I put an iframe behind.

currSymbolInstance = hypeDocument.getSymbolInstanceById(‘symbol1id’);
currTimeLineName = ‘slidetimeline’;

if(currSymbolInstance.currentTimeInTimelineNamed(currTimeLineName) == 0){
currSymbolInstance.continueTimelineNamed(‘slidetimeline’, hypeDocument.kDirectionForward);
}else{
currSymbolInstance.continueTimelineNamed(‘slidetimeline’, hypeDocument.kDirectionReverse);
}

Help me please.


(Jonathan Deutsch) #2

It would be useful if you could attach a zip of your .hype document along with any necessary instructions to trigger the issue; it is difficult to say based on the code alone!


(chans) #3

Sorry, This is my code.
I attach a zip file already, but I dont know it gone.
testslide.hype.zip (19.3 KB)


(Jonathan Deutsch) #4

Gotchya. Unfortunately mouse event interactions go all the way through to the iframe so I don’t think there’s a way you can handle both mouse interactions in the iframe and still have the swipes work. However, if you don’t need any interaction within the iframe, you can check Ignore all pointer events for the element (in the Actions inspector) and then the swipes will work.


(chans) #5

So, is that a bug?
Can I get it in a Hype higher version?


(Jonathan Deutsch) #6

This isn’t a bug, just the way the web works!

Another workaround I saw on the web would be that you could cover the iframe with a div/Rectangle, and there could be ways to send some of the events to the iframe and not others. This would be a bit of a JavaScript programming task though.


(chans) #7

Yeah, I used rectangle inside. You could check again.


#8

By “inside” do You mean inside the iFrame? If so @jonathan was referring to a rectangle that covered the iFrame - it is outside of, not inside, the iFrame.