I'm developing a web application and to improve the user experience I wish to switch the browser in fullscreen mode. Any ideas how to do this (except asking the user to do it himself)?
Its possible using the FullScreenApi, which is supported at least in Chrome 27, FF 21, Safari 5.1 and Opera 16. It will be also supported by IE 11. There is also a minor wrapper for API.
Javascript.resizeTo(screen.width,screen.height)
Its not possible. If you really want it, you have to open a new window:
var win = window.open('html.file', 'Name', 'fullscreen=true');
You can't do full screen but you can just resize the window to the available width and height of the screen.
Related
I am trying to run the following JavaScript as a test on a website / webapp*.
javascript: {window.alert("Hello World")}
*This website / webapp forces the EDGE browser to run on IE11 compatibility mode.
But am getting an error (translated to english) :
"No Access to Website: Make sure that the Webadress //ieframe.dll/dnserror.htm?ErrorStatus=0x8007005# is correct".
The JS Code is now visible in the url section, so I assume the above error has not much to do with the actual problem.
Tried it on Chrome and IE11 (native) and they both work with the mentioned website / webapp.
Is there a way to make it work on EDGE compatibility mode IE11?
Thanks for your help!
KR
Joe
I think you can't make bookmarklet work in Edge IE mode as IE mode doesn't support Internet Explorer toolbars.
From the image above, you can see that Favorites bar belongs to IE toolbars so you can't use it in Edge IE mode.
If you really need this feature in Edge IE mode, I suggest that you can provide feedback to Edge team by pressing Alt+Shift+I in Edge browser. Edge team will check the feedbacks and improve the product continuously.
Is it possible to force window to switch between normal and full-screen mode by JavaScript (no jQuery)..?
I know how to open a new window in full-screen, but that is not what I need.
There's now a proper fullscreen API (first proposed by Mozilla and later released as a W3C proposal) has been implemented by Webkit (Safari 5.1+/Chrome 15+) and Firefox (10+). A brief history and usage examples here. Note that IE10 will allegedly not support the API.
You could try the experimental FullScreen API.
Using full-screen mode on MDN
W3c Fullscreen Living Spec
Browser Support
If you are not satisfied with the browser support, there is one more option: display a message to the user about how F11 switches to Fullscreen mode. Used this as a fallback option in a recent webapp I worked on, and the feedback was satisfactory.
Related onclick go full screen and How to implement exact full-screen in javascript?.
Facebook has recently added the high resolution image view feature:
When I clicked it, my browser goes full screen mode:
This is native browser full screen similar to F11.
I would like to implement this feature for a local web app that will only be used internally, thus no random user being irritated by the full screen effect.
Does anybody know how to do this?
Or alternatively where I can get code to implement this, with explanation how it works?
this is a new API offered by HTML5 so only few browsers support it at the moment...
you can check MDN for some basic explanation and examples
EDIT: worth to mention > difference between Gecko and WebKit: Gecko automatically adds CSS rules to the element to stretch it to fill the screen: "width: 100%; height: 100%"
EDIT 2: supporting browsers are only Firefox (since 10) and Chrome (I think very early not quite sure when they fully supported it)... as it is experimental you need the vendor prefixes...
EDIT 3: link to "living " spec
EDIT 4: regarding IE support: 11/15/2011 Ted Johnson from IEBlog says that the IE10 team has not yet decided whether to implement the FullScreen API. He notes however that, “Windows 8 Metro style Internet Explorer is always full screen … and as before, F11 enters full screen mode in desktop versions of IE.”
EDIT 5: can I use - another nice table showing that in latest Safari available as well... whether Opera supports it in Version 12 is still unknown
There is a new HTML5 Full Screen API.
Here is a demo site of it.
http://html5-demos.appspot.com/static/fullscreen.html
I need to open the window in fullscreen using javascript. I suceeded in mozilla. but in google chrome its not working. Why is it so.? anybody help me.
I use this javascript for mozzilla.
<INPUT type="button" value="Progress window!" onClick="window.open('divs.htm','mywindow',
'fullscreen=yes,scrollbars=no,toolbar=no,location=no,directories=no,status=no,menubar=no')">
https://developer.mozilla.org/en/DOM/window.open
fullscreen
Do not use. Not implemented in Mozilla. There are no plans to implement this feature in Mozilla.
This feature no longer works in MSIE 6 SP2 the way it worked in MSIE 5.x. The Windows taskbar, as well as the titlebar and the status bar of the window are not visible, nor accessible when fullscreen is enabled in MSIE 5.x.
fullscreen always upsets users with large monitor screen or with dual monitor screen. Forcing fullscreen onto other users is also extremely unpopular and is considered an outright rude attempt to impose web author's viewing preferences onto users.
Supported in: IE
fullscreen does not really work in MSIE 6 SP2.
IIRC the fullscreen attribute is not cross browser compatible. It's called Kiosk mode i believe and chrome does not support it and so do many other browsers.
I am working on a Flash app that is 900x700 pixels. When viewed in misc. browsers at 1024x768, the browser chrome causes robs too much of the vertical space and the app appears in a window with a vertical scrollbar. Unacceptable.
The flash app will be launched via a link emailed to the viewers.
I'd like to avoid resizing the flash app and am wondering if there's a way to do the following via javascript, with no clicks involved:
maximize the current browser window
remove current window address bar and tabs / switch browser to full screen view (equivalent to pressing F11).
An alternative would be to resize the flash app vertically to match the browser canvas height to avoid scrolling. This may cause the app to become unreadable, so not the best approach in my case.
Thank you!
UPDATE: Seems that browser resizing and autoswitch to full screen won't work and neither will the flash app auto resize. What is the best approach then? And, some users may have browsers with toolbars or open a small browser window.
The only idea I have is to use javascript and display a message to users with small browser windows to pres F11 manually. The audience is executes and some may not even know what an F11 means...
There is no way to maximize the browser window to full screen with JavaScript. While this is unfortunate for your genuine requirement, it is considered a security restriction.
Sources:
Stack Overflow - To view the silverlight app in fullscreen mode(F11)
SitePoint Forums - Trigger F11 using javascript
Webmaster World - F11 Fullscreen using Javascript
The window size can be altered by using:
window.moveTo(0, 0);
window.resizeTo(screen.availWidth, screen.availHeight);
To answer the question in the comment you made to your own post. Yes. You can have a button whose click handler does this
stage.displayState = StageDisplayState.FULL_SCREEN;
You can use JavaScript to open a new window (using window.open) and control the window that is opened (no address bar, etc). You can also control the size of the window (you can't maximize it, but you can get the users screen size, and set the window that same size).
Chrome 15, Firefox 10, and Safari 5.1 now provide APIs to programmatically trigger fullscreen mode. Fullscreen mode triggered this way provide events to detect fullscreen changes and CSS pseudo-classes for styling fullscreen elements. These APIs may present you with a more acceptable solution for those browsers.
See this hacks.mozilla.org blog post for details.