如何使用不同的网址创建模式弹出窗口

Question

I'm trying to think how to create a Modal Popup Window that loads an HTML page and also with different URL for each popup.

This is an example

You can see that it is like a modal window with its own URL. Do you have any ideas? I have to create exactly the same thing as the example.

I tried with something like this:

<script type="text/javascript">

    var style = "top=center, left=center, width=500, height=500, status=no, menubar=no, toolbar=no, scrollbars=no, resize=no";

    function Popup(url) {
        window.open(url, "", style);
    }
</script>

But I don't know how to get out about the URL thing.

Sorry for english ;)

Answer 1

I think what you might be referring to is showModalDialog() function. Open() would just open the url in a new tab or window.

var style = "top=center, left=center, width=500, height=500, status=no, menubar=no, toolbar=no, scrollbars=no, resize=no";
function Popup(url) {
        window.showModalDialog(url, "", style )
    }

It's a very old approach. In order to get the modal layout closer to what you want, you can either use bootstrap modal popup http://www.w3schools.com/bootstrap/bootstrap_modal.asp or jquery modal popup https://jqueryui.com/dialog/ .