<div style="display:none" id="imgglow"><img src="prj14_glow.png"></div>
    <div style="display:none" id="imgcaustic"><img src="prj14_caustic_bgr.png"></div>

    <script type="text/javascript">
        function show(id) {
            var element = document.getElementById(id);

            element.style.display = "block";

            // These function will not exist in the browsers that don't support fullscreen mode yet,
            // so we'll have to check to see if they're available before calling them.
            if (element.mozRequestFullScreen) {
                //Firefox
                element.mozRequestFullScreen();
            } else if (element.webkitRequestFullScreen) {
                //Chrome and Safari.  Both of those browsers are based on the Webkit project, hence the same prefix.
                element.webkitRequestFullScreen();
            }
        }
    </script>
    <style type="text/css">
        .player:-webkit-full-screen {
            width: 100%;
            height: 100%;
        }
        .player:-moz-full-screen {
            width: 100%;
            height: 100%;
        }
    </style>

    <p>
        <button onclick="show('imgglow');">Show Image 1</button><br/>
        <button onclick="show('imgcaustic');">Show Image 2</button>
    </p>