Why is the Fullscreen API w3schools example not working in Firefox - javascript

Does anyone know why the fullscreen api does not work on Firefox? The w3schools example does not work either. I don't get any response from the button clicks.
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_fullscreen2
I am trying to do a fullscreen div via a button click. It works in Chrome but not Firefox

Open the developer tools. Look at the console. Firefox will tell you why.
Request for fullscreen was denied because at least one of the document's containing elements is not an iframe or does not have an "allowfullscreen" attribute.

Related

Chrome disabled javascript and doesn't allow to enable it

I am not able to enable javascript in Chrome. Under Chrome javascript setting the default option for "sites can use javascript" is grayed out. Even if I add website manually under "Allowed to use javascript" the website is not loading, screenshot below.
This happened while I was trying to find a solution for another issue and followed solution from this page (the top answer), so I went to Chrome Devtools > Sources and clicked on the pause button since then the javascript has got disabled. Paused in debugger in chrome?
Note: Javascript is working fine in other Chrome Profiles. The issue is with this particular Chrome Profile.
Try right-clicking the "Sites can use Javascript" option, and inspect element:
Then, remove the disabled or disabled="" attribute from whatever element the console brings you to.
The option should be enabled. Click it and try reloading your site again.
If this doesn't work, you can try reporting any problems for whatever chrome has (I use Mozilla Firefox and I know they have a help center).
Or try re-installing the browser, because some files may be corrupt (don't worry, if you have an account you can sign-in after the reinstallation and everything should be synced).

how to disable download option of iframe in Safari Browser?

I am embedding pdf file in iframe using iframe tag.
To disable download option I am using #toolbar=0&scroolbar=0 which is working fine for Google Chrome, Mozilla etc.
But in Safari browser from MAC OS it is not working and a toolbar is popping up on mouse hover and download option is available in that toolbar. I want to hide that toolbar.
I tried using embed tag with #toolbar=0&scroolbar=0 as well but its not working.
I have added screenshot for your reference. Any help is highly appreciated.
Click on this link to see screenshot in which toolbar with download option can be seen

Drawing in canvas not working in iframe when in firefox

Hello I am trying to make a simulation of a ruler measuring a desk. The mousemove event works when I open the simulation alone but not when I open it in an iframe like here. The iframe works when opened with Chrome or Opera but not with Firefox. It also works with Edge after I press F12. Please help I am just a teacher not a developer and browser compatibility is far beyond my understanding.
Update: After the answer of murphy1312 I also noticed that my problem is also because the iframe is in a hidden tab that loads initially with display:none. Is there something I can do in the iframe document without changing anything in the parent page?

IE11 fullscreen doesn't work properly in Iframe

I was trying to implement fullscreen in IE11 using bigscreen.js. It works well with some hack.
But It doesn't work well with the same url embedded in IFrame.
I have video and canvas element in IFrame. Video element successfully goes to fullscreen.
But canvas, svg and some other elements are not going to fullscreen mode.
Is this the known issue with IE11? If so is there any around to make it work.
Thanks.
You have to click F12 (open developer tools)
Try all combinations to IE Mode ans Quirks Mode
You will find one that works (if you come from IE10) probabely :
Navigator Mode IE10 / Quirks Norme

IE Chrome Frame Full Screen

I have a working implementation of full screen working for Safari, Firefox, and Google Chrome. From what I have read it should work for ie with google chrome frame but when I click the full screen button I created nothing happens. Any ideas? Is it not yet supported?
$('#enable_fullscreen').click ->
calculate_presentation_font_size(height)
if docElm.requestFullscreen
docElm.requestFullscreen()
else if docElm.mozRequestFullScreen
docElm.mozRequestFullScreen()
else if docElm.webkitRequestFullScreen
docElm.webkitRequestFullScreen()
Putting an alert in the "webkitRequestFullScreen" if statement shows that it does go to this condition in chrome frame but docElem.webkitrequestFullScreen() is undefined.
I've build it and made it work from this examples.
https://developer.mozilla.org/en-US/docs/DOM/Using_full-screen_mode
The only things I can see missing from your code for the webkit condition is the parameter "Element.ALLOW_KEYBOARD_INPUT" to the webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT)
Unfortunately the main problem of chrome frame is the communication with the IE window that literally behave like a difficult child ;-)
For IE you can open a popup window in fullscreen mode by directly calling document.location.href for the source it will open the current page your are on
window.open(document.location.href, 'myAppfullscreen', 'fullscreen=1');

Categories