CODEWITHSUNDEEP
javascriptjqueryfullscreenjquery-events
Poru
Poru

Reputation: 8360

Fullscreen API: Which events are fired?

I need to know which (DOM) events are fired when a user enter the fullscreen mode via the new Fullscreen API. I tried for example this snippet but it doesn't fire:

jQuery('body').on('fullScreenChange', function() { alert("Fired!"); });

Upvotes: 28

Views: 39427

Answers (3)

user1106925
user1106925

Reputation:

Your link shows the answer...

When full-screen mode is successfully engaged, the document which contains the full-screen element receives a fullscreenchange event. When full-screen mode is exited, the document again receives a fullscreenchange event. Note that the fullscreenchange event doesn't provide any information itself as to whether the document is entering or exiting full-screen mode, but if the document has a non null fullScreenElement , you know you're in full-screen mode.

Upvotes: 19

Bobbi Bennett
Bobbi Bennett

Reputation: 1646

I was using:

$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange MSFullscreenChange', fn);

It fires for Safari, Chrome, and Firefox (haven't tested others). There seems to be a subtle difference in the resulting context between webkit and moz, element height and width are different. But the events fire, which is your question.

Oh. And watch out for using alert('fs') with full screen testing. It often interferes with the screen change.

Upvotes: 66

powtac
powtac

Reputation: 41050

There is no fullscreenChange event in native jQuery. But there are several third-party plugins which provide you access to the event:

As you can see on their code there is no clean API access to this type of event.

Upvotes: 3

Related Questions