SOURCE

console 命令行工具 X clear

                    
>
console
var h1_in = document.querySelector('h1');
var box = document.querySelector('.box');
var close = document.querySelector('.close');
var in_Vip = document.querySelector('.inVip')
h1_in.addEventListener('click',function(){
    box.style.display = 'block';
    close.style.display = 'block';		
})

close.addEventListener('click',function(){
    box.style.display = 'none';
    this.style.display = 'none';
})

in_Vip.addEventListener('mousedown',function(e){
    var x = e.pageX-box.offsetLeft;
    var y = e.pageY-box.offsetLeft;

    document.addEventListener('mousemove',move)
	function move(e){	
    	box.style.left = e.pageX - x + 'px';
        box.style.top = e.pageY - y + 'px';
        }
    
    document.addEventListener('mouseup',function(){
		document.removeEventListener('mousemove',move)
    })
})



	<h1>
        点击登录
    </h1>

    <div  class="box">
		<p class="inVip">登录会员</p>
        <form action="">
			<table>
				<tr>
                    <td>用户名:</td>
                    <td>
                    <input type="text" placeholder="请输入用户名">
                    </td>
                </tr>

                <tr>
                    <td>登录密码:</td>
                    <td>
					<input type="password" placeholder="请输入登录密码"">
                    </td>
                </tr>
            </table>
        </form>
        <butto>登录会员</button>
        <div class="close">关闭</div>
    </div>
h1{
    width: 100%;
    text-align: center;
}

.box{
    display: none;
    background-color: white;
    width: 500px;
    height: 200px;
    position: relative;
    margin: auto;
}

.box p{
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    padding-top: 10px;
}

table{
    text-align: right;
}

input{
    width: 360px;
    height: 30px;
}

button{
    width: 200px;
    height: 40px;
    background-color: white;
    border: 1px solid rgb(204, 195, 195);
    margin-left: 140px;
    margin-top: 10px;
}

.close{
    border-radius: 40px 40px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    position: absolute;
    top: -20px;
    left: 480px;
    background-color: white;
}