Jquery实现自定义弹窗示例 |
您所在的位置：网站首页 › 企业选择融资方式考虑的因素有哪些呢英语 › Jquery实现自定义弹窗示例 |
Jquery实现自定义弹窗示例
在项目开发中，如果我们使用javascript自带的提示对话框，感觉不怎么美观，所以我们通常都是自己定义一些对话框，这里我实现点击按钮就弹窗一个登录的窗口，点击该窗口并可以实现拖拽功能，太多文字的东西说不清楚，直接用代码说话...
在项目开发中，如果我们使用javascript自带的提示对话框，感觉不怎么美观，所以我们通常都是自己定义一些对话框，这里我实现点击按钮就弹窗一个登录的窗口，点击该窗口并可以实现拖拽功能，太多文字的东西说不清楚，直接用代码说话。 这里我将HTML、CSS、Jquery代码分别贴出来 HTML部分： 代码如下: 弹窗 登录腾虎通行证 × 请输入用户名 请输入密码 下次自动登录 忘记密码？ 立即注册可以使用一下方式登录 QQ MSNCSS部分代码： 代码如下: *{margin:0px;padding:0px;color:#555555;} .alter{width:50px;height:30px;margin:10px} .box{ width:100%; height:100%; position:fixed; top:0; left:0; background: -moz-linear-gradient(rgba(11,11,11,0.5), rgba(11,11,11,0.1)) repeat-x rgba(11,11,11,0.1); background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(11,11,11,0.1)), to(rgba(11,11,11,0.1))) repeat-x rgba(11,11,11,0.1); z-index:100000; display:none; } .box_content{ height:420px; width:350px; background:white; position:fixed; top:0; left:0; } .box_content .title{ height:45px; width:100%; background:#EEEEEE; line-height:45px; overflow:hidden; } .title:hover{cursor: move;} .title h3{float:left;margin-left:20px;} .title h2{float:right;margin-right:15px;color:#999999} |
【本文地址】
今日新闻 |
推荐新闻 |