View Full Version : Button using JS with functionality of F11 keyboard key

04-26-2012, 11:27 AM
I want to make a button which if pressed works as if F11 key on keyboard is pressed.
For button html would be like this (I think)

<button type="button" onclick="some function">FullScreen</button>

Now I don't know what function would go in that onclick as I don't have the JS. One more thing that would be nice if the text 'FULLSCREEN' changes to 'NORMAL WINDOW' when the button is pressed, so that the user could realize that they have to press the same button again to get out of fullscreen, it would be like toggle at every click text changes from 'FULLSCREEN' to 'NORMAL WINDOW' and then if pressed again changing to 'FULLSCREEN'.

04-26-2012, 12:25 PM
I'm new here , nice thread!

Welcome to dynamic drive

05-01-2012, 08:00 PM
Try something like:

// JavaScript Code:

function toggleFullScreenMode() {
var btn = document.getElementById( 'btnFullScreenToggle' );
if ( btn.value == 'goFull' ) {
var widthFullScreen = screen.availWidth;
var heightFullScreen = screen.availHeight;

window.open( window.location.href, '',
'toolbar=no,' +
'location=no,' +
'directories=no,' +
'status=no,' +
'menubar=no,' +
'scrollbars=1,' +
'resizable=no,' +
'copyhistory=1,' +
'width=' + widthFullScreen + ',' +
'height=' + heightFullscreen + ',' +
'top=0,' +
,'replace' );
btn.value = 'goNormal';
btn.innerHTML = 'Normal Mode';
} else if ( btn.value == 'goNormal' ) {
window.open( window.location.href, '','','replace' );
btn.value = 'goFull';
btn.innerHTML = 'Full Screen Mode';

// HTML Code:

<button name="btnFullScreenToggle" id="btnFullScreenToggle" type="submit" value="goFull" onclick"toggleFullScreenMode();">Full Screen Mode</button>