<!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. android:descendantFocusability的作用：viewgroup与其上面view的焦点控制，如何让子view失去焦点等。

    ViewGroup的下面这个属性可以控制. 原文: android:descendantFocusability Defines the relationship between the ViewGr ...

  2. mac 10.8 编译提示找不到GCC

    本机已安装xcode,但是在编译prce时提示找不到GCC,要不安装gcc.pkg ,简单起见,启动xcode->menu->preferences->Dowloads 把里面的co ...

  3. codeforces 510 C Fox And Names【拓扑排序】

    题意:给出n串名字,表示字典序从小到大,求符合这样的字符串排列的字典序 先挨个地遍历字符串,遇到不相同的时候,加边,记录相应的入度 然后就是bfs的过程,如果某一点没有被访问过,且入度为0,则把它加入 ...

  4. UVALive 5713 Qin Shi Huang's National Road System秦始皇修路（MST，最小瓶颈路）

    题意: 秦始皇要在n个城市之间修路,而徐福声可以用法术位秦始皇免费修1条路,每个城市还有人口数,现要求徐福声所修之路的两城市的人口数之和A尽量大,而使n个城市互通需要修的路长B尽量短,从而使得A/B最 ...

  5. HDU 2577 How to Type (DP，经典)

    题意: 打字游戏,求所按的最少次数.给出一个串,其中有大小写,大写需要按下cap键切换到大写,或者在小写状态下按shift+键,这样算两次,打小写时则相反.注意:在打完所有字后,如果cap键是开着的, ...

  6. InputStream重用技巧（利用ByteArrayOutputStream）

    有时候我们需要对同一个InputStream对象使用多次.比如,客户端从服务器获取数据 ,利用HttpURLConnection的getInputStream()方法获得Stream对象,这时既要把数 ...

  7. python练习程序（c100经典例3）

    题目: 一个整数,它加上100后是一个完全平方数,再加上168又是一个完全平方数,请问该数是多少? for i in range(1,100000): a=i+100; b=a+168; sa=int ...

  8. opengl截图

    int GetEncoderClsid(const WCHAR* format, CLSID* pClsid) { UINT num = ; // number of image encoders U ...

  9. DOJO 如何清空表单

          在Dojo里,清空表单非常简单 在设置好了相关的环境之后,只要设置dom.byId('formid').reset(); / dijit.byId('formid').reset; Jqu ...

  10. table 锁定表头，出滚动对齐

    前一段时间来了一个汇总的需求,想锁定表头,这个问题在网上找了老半天,实现起来都比较麻烦,经过这几天的摸索终于找到一个简洁的处理方法 下面介绍一下如何处理的: 1.thead 和tbody 放两个tab ...