<!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. 等额本息Vs等额本金

    1:贷款种类一旦选择不能改变.2:你提前还款的全部属于本金部分,若能一次性归还本金只需付清当月月息即可[不按年利率计算而是月利率],与你归还的本金违约金[设:提前还款10万*X.XXX%=违约金,具体 ...

  2. An AnnotationConfiguration instance is required to use

    An AnnotationConfiguration instance is required to use <mapping class="jebe7282/study/hibern ...

  3. bzoj4026

    直接按照欧拉函数的计算方式来即可 φ=区间积*区间出现(质数-1)的积/区间出现过的质数的积 区间积是满足类似区间减法的操作的(利用逆元) 由于强制在线,上主席树就可以了(维护每个质数上次出现的位置p ...

  4. 4630 no pain no game 树状数组

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=4630 题意:给你N个数,然后给你M个询问,每个询问包含一个l 一个r,问你lr 这个区间中任意两个数最 ...

  5. mac 安装使用 webp 来压缩图片

    学习性网站: https://developers.google.com/speed/webp/docs/cwebp http://www.w3ctech.com//topic/1672 https: ...

  6. I.MX6 Android backlight modify by C demo

    /************************************************************************** * I.MX6 Android backligh ...

  7. HDU 5273 Dylans loves sequence (逆序对，暴力)

    题意: 给定一个序列,对于q个询问:(L,R)之间有几个逆序对?序列元素个数上限1000,q上限10万.仅1测试例子. 思路: [L,R]的逆序对数量可以这么算,假设L<=K<R,将区间拆 ...

  8. 流程引擎的API和服务基础

    RepositoryService :  管理和控制 发布包 和 流程定义(包含了一个流程每个环节的结构和行为) 的操作 除此之外,服务可以 查询引擎中的发布包和流程定义. 暂停或激活发布包,对应全部 ...

  9. 【英语】Bingo口语笔记(56) - “令人失望”的表达

  10. 通过外部接口 根据ip获取城市名

    3种接口 淘宝/百度/不知名/   推荐淘宝接口 ip自个去获取,下附带php 获取ip的示例 function getIP() { static $realip; if (isset($_SERVE ...