in javascript open popup with href link

user_13135427 0
Viewed 54

when I view this codes , iframe popup automatically open. but I want to open iframe when I click "click me" button. could you please help me ? I hope that its very easy trick but I am an amateur for javascript.

<html>
<head>
<script language="javascript">
var iframe = '<html><head><style>body, html {width: 100%; height: 100%; margin: 0; padding: 0}</style></head><body><iframe src="http://www.euronews.com" style="height:calc(100% - 4px);width:calc(100% - 4px)"></iframe></html></body>';
var win = window.open("","","width=1024,height=768,toolbar=no,menubar=no,resizable=yes");
win.document.write(iframe);
</script>
<head>
<body>
<a href="javascript:load();"><b><font color="000">Click Me !</font></b></a>
</body>
</html>
popup iframe html javascript
2 Answers

I have fixed your code for you. You should probably not use an inline call, but here is how you would do it. Make sure to wrap your code in the load function so when you call javascript:load() it will complete the function.

<html>
    <head>
        <script language="javascript">
            function load() {
                var iframe = '<html><head><style>body, html {width: 100%; height: 100%; margin: 0; padding: 0}</style></head><body><iframe src="http://www.euronews.com" style="height:calc(100% - 4px);width:calc(100% - 4px)"></iframe></html></body>';
                var win = window.open("","","width=1024,height=768,toolbar=no,menubar=no,resizable=yes");
                win.document.write(iframe);
            }
        </script>
    </head>
    <body>
        <a href="javascript:load();"><b><font color="000">Click Me !</font></b></a>
    </body>
</html>
user_149937050

A solution could just be not creating the Iframe until the button is clicked:

<html>
<head>
<script language="javascript">
            function load() {
                var iframe = '<html><head><style>body, html {width: 100%; height: 100%; margin: 0; padding: 0}</style></head><body><iframe src="http://www.euronews.com" style="height:calc(100% - 4px);width:calc(100% - 4px)"></iframe></html></body>';
                var win = window.open("","","width=1024,height=768,toolbar=no,menubar=no,resizable=yes");
                win.document.write(iframe);
            }
        </script>
    </head><body>
        <a href="javascript:load();"><b><font color="000">Click Me !</font></b></a></body>
</html>
user_151922650
Related