<!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. python3字符串格式化

    print('Hello World')print('%s',55)print('%6.2f' % 1.235)print('%06.2f' % 1.235)print('-%06.2f' % 1.2 ...

  2. 《OD大数据实战》Hive环境搭建

    一.搭建hadoop环境 <OD大数据实战>hadoop伪分布式环境搭建 二.Hive环境搭建 1. 准备安装文件 下载地址: http://archive.cloudera.com/cd ...

  3. 【Todo】深入PHP内核系列

    看到一个<深入PHP内核>系列,Todo: http://www.csdn.net/article/2014-09-15/2821685-exploring-of-the-php [问底] ...

  4. Python3 学习第十弹： 模块学习三之数字处理

    math模块 提供基础的数学函数, cos(3.14) = -0.999..(弧度制) acos(1) = 0.0 sqrt(9) = 3.0 degrees(3.14) = 179.9999..(弧 ...

  5. 重装yum

    1)卸载yum rpm -aq|grep yum|xargs rpm -e --nodeps 2)下载并安装python-urlgrabber,python-pycurl,yum-metadata-p ...

  6. C的结构体使用

    C的结构体演示 #include <stdio.h> struct A //建立结构体A { char *name; int s1; struct A *next; }; void mai ...

  7. 【英语】Bingo口语笔记(37) - 动物的多种表达

    let the cat out of the bag.不在袋子中的猫 指秘密被泄露 dog tired 累成狗 doggy bag  食品袋

  8. OpenVz一键安装openvpn

    # !/bin/sh # OPENVPN SERVER CONFIGURATION echo "####################################" echo ...

  9. 剑指offer-第二章排序之年龄排序

    题目:对某个公司的人的年龄(0-99)进行排序,该公司的总人数为几万人.要求时间复杂度为O(n),可以辅助O(n)的空间. 思路:实现函数为void SortAge(int ages[],int le ...

  10. Linux下ll命令与ls -l

    还大三Linux课的债. 1.ll命令用于显示当前文件下非隐藏文件的详情 查询结果分为7栏: 1)如' -rw-r--r--' 表示三种用户对该文件的不同权限: r:可读:w:可写:x:可执行 其中第 ...