Open a new popup browser window with given HTML content using javascript

idkblogs.com August 19, 2020

Shubham Verma

n this article, we will write the code to open the new popup browser window dynamically using javascript.

Let's have the code below:

                           const OpenWindow = () => {
                                const newWindow = window.open('', '', 'width=100, height=100');
                                if(newWindow){
                                  const document = newWindow.document.open();
                                  document.close();
                                  newWindow.moveTo(0, 0);
                                  newWindow.resizeTo(window.screen.width, window.screen.height);
                                  document.write('<h1>Hello World</h1>');
                                }
                              }
                    
                              OpenWindow();

Demo:

Let's have the complete code with demo. Create a file with name "window.html" and write the below code and later open this html file in the browser and see the result.

                        <!DOCTYPE html>
                        <html>
                        <head>
                          <meta charset="UTF-8">
                          <title>IDKblogs</title>
                        </head>
                        <body>
                        <script id="script">
                            const OpenWindow = () => {
                                const newWindow = window.open('', '', 'width=100, height=100');
                                if (newWindow) {
                                    const document = newWindow.document.open();
                                    document.close();
                                    newWindow.moveTo(0, 0);
                                    newWindow.resizeTo(window.screen.width, window.screen.height);
                                    document.write('<h1>Hello World - www.idkblogs.com</h1>');
                                }
                            }
                            OpenWindow();
                        </script>
                        </body>
                        </html>

When you open the above file into the browser, then it will run the script code and you can see in that code we have written the logic to open a new popup window of screen height and screen width with given html content.