今天本人要做一个点击弹出的功能，因为这个功能是最后做的，所以写的时候很纠结， 因为本人小菜一枚， 开始尝试用 position：relative；来做一试不行呀 ，因为用这个来做的话 会打乱原有的布局， 然后我就又尝试 absolute 来做，其实用绝对定位是正确的 可是我当时犯蒙，把弹出框放在html最后面 然后定位用了 top 还有left，结果absulute虽然不会影响布局 可是位置是死的，好了 不屁话了 直接上正确的方式。

　　对了 最后我被气的好考虑过用js来做  先获取一个可以随着浏览器移动而移动的div的位置  然后获取他的x，y  然后 弹出div的位置用获取到的x，y。这虽然没有试，但是我估计也是可以的 可能就是麻烦点。

正确的方式应该是：html页面

css页面：

这样写就能保证弹出框的div不会干扰到其他的div  位置又不是死的 不会因为浏览器的分辨率而发生位置变化。 但是具体深层次的原因 还是不太懂

欢迎大神留言不吝赐教！

关于div弹出层的实际应用心得的更多相关文章

  1. LODOP内嵌挡住浏览器的div弹出层

    首先,做一个简单的div弹出层用于测试,该弹出层的介绍可查看本博客另一篇博文:[JS新手教程]浏览器弹出div层 然后加入LODOP内嵌,LODOP可以内嵌,C-LODOP不能内嵌,可以在IE等浏览器 ...

  2. div弹出层的效果带关闭按钮

    下面我做的这个是个进度条的弹出层 <style type="text/css"> #tuxiang { width: 57px; } /*div弹出框的css*/ .t ...

  3. 页面DIV弹出层 JS原生脚本

    <script type="text/javascript"> /*         * 弹出DIV层         */ function showDiv() { ...

  4. 一个简单的div弹出层的小例子

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. div滚动条弹出层效果 （所需要的css文件和js文件，都已经上传到文件里面了progressbar.rar）

    <%--总的弹出层--%> <div class="tcck" id="joinclub" style="display:none& ...

  6. 关于淘宝店铺装修弹出层popup的记录

    小龙最近做了一下下淘宝的店铺装修,里面封装的widget深不见底,刚刚整明白popup,也就是弹出层的使用方法,大神勿喷: <div class="area001">触 ...

  7. DIV弹出和关闭新DIV

    代码用HTML+JS实现: 代码(用HTML+JS实现): <!doctype html> <html lang="UTF-8"> <head> ...

  8. 【Bootstrap3.0建站笔记二】button可下拉弹出层

    1.button可下拉弹出层: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY2hpbmFwbGFu/font/5a6L5L2T/fontsize/400 ...

  9. asp.net弹出层实例

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.c ...

随机推荐

  1. ueditor不自动加P解决方法

    百度的Ueditor编辑器出于安全考虑; 用户在html模式下粘贴进去的html文档会自动被去除样式和转义. 虽然安全的,但是非常不方便. 做一下修改把这个功能去掉. 一.打开ueditor.all. ...

  2. asp.net mvc 自定义身份验证

    1.定义身份实体对象 /// <summary> /// 网站用户实体对象 /// </summary> public class DDTPrincipal : IPrinci ...

  3. windows环境下安装vue+webpack的开发环境

    本人最近在学习vue,在学习的过程中遇到对的问题和解决方法 1.我们首先要安装node.js.node.js的官方地址为:https://nodejs.org/en/download/,下载完毕,按照 ...

  4. [Linux] mail 命令，进入邮箱及删除邮件

    1. 命令行输入mail 2. 删除邮件 d 删除当前邮件,指针下移: d 1 删除标号为1的邮件: d 2-4 删除标号2到4的邮件: 3. 保存 q 退出mail命令平台,保存之前的操作,比如删除 ...

  5. dp、px、dpi、ppi

    概念: dpi(Dots Per Inch):每英寸上的点数,最初用于衡量打印物上每英寸的点数密度,打印机在一英寸内打多少个点.DPI值越小越不精细. ppi(Pixels Per Inch):每英寸 ...

  6. 关于C++的递归调用（n的阶乘为例）

    C++,是入门编程界的一门初期的语言.今天我们浅谈一下有关C++的递归调用. 在没有继承,多态,封装之前,C++几乎看成是C语言,除了一些简单的输出和头文件. 具体代码实现如下: #include&l ...

  7. runtime 运行机制

    // //  HKPerson.h //  runtimeDemo1 // //  Created by 123 on 16/5/23. //  Copyright © 2016年 123. All ...

  8. configure: error: no acceptable C compiler found in $PAT 的解决方案

    configure: error: no acceptable C compiler found in $PATH See `config.log' for more details.你的机器里没有安 ...

  9. SQL Server 2012安装后找不到服务器名称的解决办法！！！

    网上说使用localhost即可,确实没错,但是有的仍旧会报出无法找到错误,我在无法通过的时候又重新安装了SQLServer,这次选中全部默认安装,之前使用的是选择安装,然后发现多了几个配置,其中有一 ...

  10. java的数据类型的转换

    一:java的数据类型转换除布尔类型boolean(不能转换)有两种:<一> 自动转换: <二> 强制转换 <一>.自动转换:就是将小的数据类型自动转换成大的数据类 ...