您的位置:首页 - 教程 - 网页特效 - 正文
jQuery弹出可拖动的登录对话框层

体验效果:
http://hovertree.com/texiao/jquery/89/

末尾附有源码下载

代码如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>jQuery实现可推动的弹出登录对话框层_何问起</title><base target="_blank" />
<link href="http://hovertree.com/texiao/jquery/89/css/demo.css" rel="stylesheet" />
<script src="http://down.hovertree.com/jquery/jquery-1.10.2.min.js"></script>
<script src="http://hovertree.com/texiao/jquery/89/layer/layer.js"></script>
<script src="http://hovertree.com/texiao/jquery/89/js/demo.js"></script>
<style>a{color:blue}</style>
</head>
<body>
<div id="header">
<div class="hitem dreg"><a href="http://hovertree.com/menu/texiao/">注册</a></div>
<div class="hitem dlogin"><a href="javascript:;" onClick="ShowLoginBox()" target="_self">登录</a></div>
</div>
<div>请点击右上角的登录链接。<a href="http://hovertree.com/h/bjaf/ec38oldv.htm">说明</a></div>
<div id="dloginbox">
<div class="loginitem"><input type="text" id="txtUserName" placeholder="请输入用户名"/></div>
<div class="loginitem"><input type="password" id="txtPwd" placeholder="请输入密码" /></div>
<div class="loginitem"><a href="javascript:;" onClick="Login()">登录</a></div>
</div>
</body>
</html>

点击这里进入下载

评论: