<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<style>

*{

    margin:0;

    padding:0;}

#login{

    width:400px;

    height:300px;

    position:absolute;

    border:1px #CCCCCC solid;

    padding:15px;

    }

#close{

    position:absolute;

    right:0px;

    top:0px;

    cursor:pointer;

    }

</style>

<script type="text/javascript" src="jquery-1.11.2.js"></script>

<script>

$(function ()

{

    $('#btn').click(function ()

    {

        var ologin = $('<div id="login"><p>用户名：<input type="text"></p><p>密码：<input type="password"></p><div id="close">X</div>)</div>');

        $('body').append(ologin);

        ologin.css('left',($(window).width() - ologin.outerWidth())/2);

        ologin.css('top',($(window).height() - ologin.outerHeight())/2 + $(window).scrollTop());

        $('#close').click(function ()

        {

            ologin.remove();

        })

    })

})

</script>

</head>

<body>

<input type="button" id="btn" value="点击">

</body>

</html>

jq 弹出窗口的更多相关文章

  1. jQuery弹出窗口完整代码

    jQuery弹出窗口完整代码 效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/1.htm 1 <!DOCTYPE html PUBLIC "- ...

  2. layer：好看的弹出窗口

    layer是一款web弹层组件,只需在调用时简单地配置相关参数,即可轻松实现丰富与便捷的操作体验. 这是layer的官方地址,里面的使用介绍非常详细(http://layer.layui.com/) ...

  3. jQuery弹出窗口浏览图片

    效果预览:http://keleyi.com/keleyi/phtml/jqtexiao/3.htm HTML文件代码: <!DOCTYPE HTML> <html> < ...

  4. EasyUI弹出窗口实例

    效果体验:http://hovertree.com/texiao/jeasyui/1.htm 源代码下载:HovertreeJEasyUI HTML文件代码: <!DOCTYPE html> ...

  5. 让IE8在win7下面能显示使用window.showmodaldialog弹出窗口的地址状态栏

    问题来源:最近又要对老的系统进行改善,由于用到了window.showmodaldialog这个方法弹出窗口,比如从主界面弹出新增或者修改窗口,如下图所示,显示没有地址栏,进行代码修改还要找到相应的文 ...

  6. java selenium (十二) 操作弹出窗口

    selenium 中如何处理弹出窗口 阅读目录 原理 在代码里, 通过         Set<String> allWindowsId = driver.getWindowHandles ...

  7. JSP弹出窗口和模式对话框

    本文转载于其它blog,在此向本文原创者,致意!    JSP 弹出窗口  一.window.open() 基础知识      1.window.open()支持环境:  JavaScript1.0+ ...

  8. [转]js来弹出窗口的详细说明

    1.警告对话框 <script> alert("警告文字") </script> 2.确认对话框 <script> confirm(" ...

  9. OAF_开发系列08_实现OAF通过Popup参数式弹出窗口（案例）

    20150711 Created By BaoXinjian

随机推荐

  1. itnesse实现api接口自动化测试学习

    上午在园子里乱逛,看了不少小伙伴们分享的接口测试方面的知识,大家所叙述到的一些经验或多或少,我也曾遇到过,突然意识到知识的点滴积累是多么的重要,我记得我最早接触接口测试的时候,就是只在浏览器里人工测试 ...

  2. .htaccess的应用

    今天下班后,同事问到这个东西的用法.我以前也没接触过,特地搜索了一下,现在保存方便以后使用. 1.首先判断服务器类型,服务器是否支持. 2.写法是否有错误. 3.需要的功能是否在.htaccess是否 ...

  3. BZOJ 2115 Xor（抑或值最大路径）

    题目链接:http://61.187.179.132/JudgeOnline/problem.php?id=2115 题意:给出一个带权无向图.求一条1到n的路径使得路径上权值的抑或值最大? 思路:( ...

  4. hdu 1044(bfs+状压)

    非常经典的一类题型 没有多个出口.这里题目没有说清楚 Collect More Jewels Time Limit: 2000/1000 MS (Java/Others)    Memory Limi ...

  5. Nginx proxy_pass 加与不加 "/" 区别

    下面四种情况分别用http://192.168.1.100/proxy/test.html 进行访问. 第一种: location  /proxy/ { proxy_pass http://127.0 ...

  6. laravel创建新model数据的两种方法

    laravel中的CRUD操作中,通过对代表数据表中row的model对象操作,来更新数据库表. 对于创建新的row的操作,有两种功能上相同的方法: 1.create: $user = User::c ...

  7. [转载]hao123军事频道首页JQ焦点图

    适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗. *本作品由[站长素材]收集整理,转载请注明出处! 下载地址

  8. Java Socket 模拟HTTP请求

    public static void main(String[] args) { try { String url = "192.168.1.103"; Socket socket ...

  9. HDU 5366 The mook jong （简单DP）

    题意:ZJiaQ希望把木人桩摆在自家的那个由1*1的地砖铺成的1*n的院子里.由于ZJiaQ是个强迫症,所以他要把一个木人桩正好摆在一个地砖上,由于木人桩手比较长,所以两个木人桩之间地砖必须大于等于两 ...

  10. acdream 1412 2-3Trees （组合+DP）

    题意:2-3树的每个结点(除了叶子外)有2或3个孩子(分支),假设是一个满2-3树,那么给出叶子的数量,求这样的树有多少棵.(注:有2个孩子的结点视为相同,有3个孩子的结点视为相同,比如倒数第2层有4 ...