Switch window between normal and full-screen mode - javascript

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

Chrome extension equivalent for firefox add-on sidebar

I am trying to create chrome extension that will create floating overlay (static one that dose not refresh), Similar to firefox add-on "ui sidebar"
Is there any way to maintain iframe like overlay that wont be effected by the page, and wont be reloaded when the tab reloads.
The simple answer is NO.
What you are describing is basically called browser chrome, i. e. UI. The only chrome Google Chrome extensions support since forever are page actions and browser actions.
Opera also supports sidebar actions. Rumor is, Firefox WebExtensions will support that too.
Chrome has no support however. It's on the wishlist but has no actual proposal/intent to ship. Apparently, there has been a recent decision not to pursue this.

How does facebook full screen with javascript?

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

why fullscreen functionality is not working in chrome?

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.

How to switch the web browser to fullscreen mode with JavaScript?

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.

toggling fullscreen mode with javascript with firefox add-on

The firefox add-on I am working on is best viewed in fullscreen mode. (I am not creating a new window, but I insert a transparent div on the body of the current page and display some pictures.) Is there a way to toggle the fullscreen mode or f11 key with javascript?
Thanks in advance,
According to https://developer.mozilla.org/en/DOM/window.fullScreen, you should be able to just do window.fullScreen = true; (provided that your script is running in the browser window, not some other window, in which case you may have to jump through a couple hoops to get a reference to the main browser window)
This property indicates whether the
window is displayed in full screen
mode or not. It is only reliable in
Gecko 1.9 (Firefox 3) and later, see
the Notes below. With chrome
privileges, the property is
read-write.

Categories