tab选项卡特效、弹窗

js：

function showurl(name, cursel, n) {
    for (i = 1; i <= n; i++) {
        var menu = document.getElementById(name + i);
        var url = document.getElementById(name + "_" + i);
        menu.className = i == cursel ? "hover" : "";
        url.style.display = i == cursel ? "block" : "none";
    }
}

function showlogin() {
            var contentDiv = document.getElementById("login");
            var divWidth = contentDiv.offsetWidth;

            login.style.display = "block";
            login.style.left = (window.screen.width - divWidth) / 2 + "px";
            login.style.top = "90px";
        }

function hid() {
            login.style.display = "none";
        }

text：

#login {display:none; width:314px; height:auto;z-index: 4;background-color:#5c92c0; position:absolute; }

<ul>

<li id="one1" οnclick="showLogin()">登 录</li>

<li id="one1" οnclick="hid()">关闭</li>

</ul>

<div id="login">

<ul>
          <li id="url1" οnclick="showurl('url',1,3)">图片</li>
          <li id="url2" οnclick="showurl('url',2,3)">视频</li>
          <li id="url3" οnclick="showurl('url',3,3)">链接</li>
        </ul>
        <div>
            <div id="url_1">图片地址:
            </div>
            <div id="url_2" style="display:none">视频地址:
            </div>
            <div id="url_3" style="display:none">链接地址:
            </div>
        </div>

        </div>