Enter full screen whenever page is loaded

Question

I'm working on asp.net quiz application. The mandatory requirement of this application is: when the application starts (page is requested), it automatically enters into full screen.

Now I tried dozen of solutions (JS & Jquery's plugins)

a number of different jquery's plugins, but Chrome & Firefox are not allowing me to do so. Because it states that it needs user interaction for that.

Can somebody please help me out of this situation? Solution can be browser dependent.

Details about application:

Total 5 aspx pages.
One page is an iframe/frame in another page.

is a "splashscreen" requiring user interaction (a click) an option? — Kaiido, Feb 02 '16 at 06:34
sorry I don;t understand. Can you please explain a little more ? — Sikander Hayyat, Feb 02 '16 at 06:36
well on page load show a [splash screen](https://en.wikipedia.org/wiki/Splash_screen) with something inviting the user to click on the page (something like "Start this awesome app !"). This way you have the "user interaction" required by the Fullscreen API — Kaiido, Feb 02 '16 at 06:39
Yep tried it. but whenever I redirect user to another page, it exit from full screen. — Sikander Hayyat, Feb 02 '16 at 06:44
yes, you'll have to make your app single paged (using iframe or ajax+DOM manipulation) — Kaiido, Feb 02 '16 at 06:46
Thanks for your suggestion. The thing is I developed everything else :/ Is there any way around ? Like another language ? Action script ? coffe script ? anything in your mind ? — Sikander Hayyat, Feb 02 '16 at 06:48
JavaScript is the only language that will be cross-browser compatible. — Matthew Herbst, Feb 02 '16 at 06:54
solution can be browser dependent. I mean if solution works onnly on FF or only on chrome. I can afford that. — Sikander Hayyat, Feb 02 '16 at 07:03
Quick and dirty solution. Let's create another page which will be our container page. Put an Iframe there, calculate Iframe height width attribute based on the screen size. make the first page as iframe source. on the iframe put frameborder=0, so from user perspective it will look like single page. — Satyaki Chatterjee, Feb 02 '16 at 07:22

Satyaki Chatterjee · Accepted Answer · 2016-02-02T09:42:02.830

1

Quick and dirty solution. Let's create another page which will be our container page. Put an Iframe there, calculate Iframe height width attribute based on the screen size. make the first page as iframe source. on the iframe put frameborder=0, so from user perspective it will look like single page

For full screen check this link http://www.css-jquery-design.com/2013/11/javascript-jquery-fullscreen-browser-window-html5-technology/

edited Feb 02 '16 at 09:42

answered Feb 02 '16 at 08:00

Satyaki Chatterjee

124
7

Let me try this solution :) – Sikander Hayyat Feb 02 '16 at 08:37
It seems that we have no solution but this. I create a simple aspx page and made an iframe and redirects it within iframe. But a problem remains there, which is when I refreshed the page (crl+r) then it displays the first page which has been set in src of iframe. – Sikander Hayyat Feb 03 '16 at 05:23
Thanks for your solution @satyaki. I really appreciate your help :D – Sikander Hayyat Feb 03 '16 at 05:23
@SikanderHayyat - Thanks.. Can you please mark this as answer? – Satyaki Chatterjee Feb 03 '16 at 06:26
Marked :D Thanks once again :) – Sikander Hayyat Feb 03 '16 at 06:33

Enter full screen whenever page is loaded

1 Answers1