当有人进入网站时弹出窗口

Question

所以基本上我想实现这样的功能：当有人访问我的网站时，它会通过弹出窗口欢迎他们，有两个选项可供选择（选择他们想要的语言）。

它看起来像这样：

我不确定我是怎么做到的，所以有人可以告诉我如何实施这样的事情吗？谢谢！

Answer 1

这对我有用。我不知道这是否是最佳方式。

HTML：

<div id="grayout"></div>
<div id="popup">
    <button type="button" id="language1">Language 1</button>
    <button type="button" id="language2">Language 2</button>
</div>
<!-- your page HTML here -->

CSS：

    #grayout {
        position:fixed;
        height:100%;
        width:100%;
        background-color:rgba(0,0,0,.5);
    }
    #popup {
        position:fixed;
        height:50%;
        width:50%;
        background-color:white;
        left:25%;
        top:25%;
    }
    #language1 {
        position:absolute;
        top:50%;
        left:25%;
    }
    #language2 {
        position:absolute;
        top:50%;
        right:25%;
    }

JavaScript的：

    document.getElementById('language1').onclick = function() {
        document.getElementById('popup').style.display = "none";
        document.getElementById('grayout').style.display = "none";
        //selected language1 code here
    };
    document.getElementById('language2').onclick = function() {
        document.getElementById('popup').style.display = "none";
        document.getElementById('grayout').style.display = "none";
        //selected language2 code here
    };