Bladephp: Now with 7+ codeigniter, php, and laravel project 7+ php project From $18/Year From Rs. 1000/Year

How to View Webpage in Fullscreen using jQuery

by
Category:jquery
jquery html css
How to View Webpage in Fullscreen using jQuery

A fullscreen website would hide all the browser elements such as address bar and bookmarks menu. In this tutorial we will show you how to view webpage in fullscreen using jQuery. You may also like How to Make Full Screen Page Loader using JavaScript

Here's how to use the jQuery Code.

<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $(".fullscreen").on("click", function ()
                {
                    document.fullScreenElement && null !== document.fullScreenElement || !document.mozFullScreen && !document.webkitIsFullScreen ? document.documentElement.requestFullScreen ? document.documentElement.requestFullScreen() : document.documentElement.mozRequestFullScreen ? document.documentElement.mozRequestFullScreen() : document.documentElement.webkitRequestFullScreen && document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT) : document.cancelFullScreen ? document.cancelFullScreen() : document.mozCancelFullScreen ? document.mozCancelFullScreen() : document.webkitCancelFullScreen && document.webkitCancelFullScreen()
                });
            });
        </script>
    </head>
    <body>
        <input type="button" class="fullscreen" value="VIEW FULLSCREEN">
    </body>
</html>

0 Comments


Html code work in comment box


Related Post