Champion Champion - 6 months ago 20
HTML Question

The Bounce on Mouse Hover and Pop Up when we Try to Close the Window

I have a question we must have seen many a time that when we are about to close the window and Just hover mouse over the cross on Browser Tab, a pop up appears asking for us to subscribe or highlighting some coupon. This Functionality is based on which feature of the browser, does it exploits some PHP code or some artificial intelligence.

Answer

It is run on client-side as everything that interact with user interface.

The example bellow shows how to do this with pure javascript (not tested with all browsers, but works well with Chrome)

<!DOCTYPE html>
<html>
    <head>
        <title>Page exit example</title>
        <script type="text/javascript">

            var showMessage = true;
            window.onmouseout = function(){

                if(showMessage){
                    showMessage = false;
                    document.getElementsByTagName('body')[0].innerHTML = "Dont leave yet!";
                }

            };

        </script>
    </head>
    <body>
        <h1>Hello world</h1>
    </body>
</html>