if($("#cont1").css("position")!="fixed"){
        $("#cont1").css("position","absolute");
        var dw = $(window).width();
        var ow = $("#cont1").outerWidth();
        var dh = $(window).height();
        var oh = $("#cont1").outerHeight();
        var l = (dw - ow) / 2;
        var t = (dh - oh) / 2 > 0 ? (dh - oh) / 2 : 10;
        var lDiff = $("#cont1").offset().left - $("#cont1").position().left;
        var tDiff = $("#cont1").offset().top - $("#cont1").position().top;
        l = l + $(window).scrollLeft() - lDiff;
        t = t + $(window).scrollTop() - tDiff;
        $("#cont1").css("left",l + "px");
        $("#cont1").css("top",t + "px");
      }

jquery计算出left和top,让一个div水平垂直居中的简单实例的更多相关文章

  1. css进阶 04-如何让一个元素水平垂直居中?

    04-如何让一个元素水平垂直居中? #前言 老板的手机收到一个红包,为什么红包没居中? 如何让一个子元素在父容器里水平垂直居中?这个问题必考,在实战开发中,也应用得非常多. 你也许能顺手写出好几种实现 ...

  2. 用css让一个容器水平垂直居中

    阅读目录 方法一:position加margin 方法二: diaplay:table-cell 方法三:position加 transform 方法四:flex;align-items: cente ...

  3. 如何用css让一个容器水平垂直居中

    方法一: 以前设置里面的绿div总是会使用{position:absolute;left:50%;top:50%;margin-left:-div宽度的一半;margin-top:-div高度的一半} ...

  4. 公司的一个面试题:如何用css让一个容器水平垂直居中?

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 七种css方式让一个容器水平垂直居中

    阅读目录 方法一:position加margin 方法二: diaplay:table-cell 方法三:position加 transform 方法四:flex;align-items: cente ...

  6. 如何让一个DIV水平,垂直方向都居中于浏览器?

    <style type="text/css"><!-- div {position:absolute;top:50%;left:50%;margin:-150px ...

  7. 如何让一个div水平和垂直居中对齐

    以下方法来自百度知道:https://zhidao.baidu.com/question/558984366971173044.html 方法1: .parent { width: 800px; he ...

  8. DIV在另一个DIV里面垂直居中,水平居中

    HTML: <div class="parent"> <div class="children"> <div class=&quo ...

  9. 关于页面布局中,如何让一个div水平和垂直居中的五个方案

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. [svc]Iaas Paas Saas区别

    https://www.zhihu.com/question/20387284

  2. atitit.ajax上传文件的实现原理 与设计

    atitit.ajax上传文件的实现原理 与设计 1. 上传文件的三大难题 1 1.1. 本地预览 1 1.2. 无刷新 1 1.3. 进度显示 1 2.  传统的html4  + ajax 是无法直 ...

  3. kvm最小磁盘大于等于5G

    上图的实验为4G(磁盘的大小) 后来磁盘大小增加到5G后,成功安装! [root@bass virhost]# virt-install --name 22cache --ram=512 --arch ...

  4. Books from Joe's blog

    Some books that I really enjoy(ed) It's been quite some time since I blogged about what I've been re ...

  5. 黑客编程教程(一)了解Windows机制

    第一节 了解Windows机制 Windows 是一个“基于事件的,消息驱动的”操作系统. 在Windows下执行一个程序,只要用户进行了影响窗口的动作(如改变窗口大小或移动.单击鼠标等)该动作就会触 ...

  6. 优雅得使用composer来安装各种PHP小工具

    Composer对php世界的影响是巨大的,使用composer来代替PEAR一定是大势所趋.当小伙伴们都还沉浸在composer带来的便利的时候,有没有想过如何更好的使用composer呢,网上大部 ...

  7. 我为什么鼓励程序员写blog

    工程师该怎样才能突破自己的能力瓶颈?写 blog! 工程师该怎样精进自己在职涯上所需要的能力?写 blog! 工程师该怎样才能保持学习与成长的动能?写 blog! 工程师该怎样才能证明自己的潜力与特质 ...

  8. Log4j常用配置及使用

    Log4j常用配置及使用 2016-12-14 目录 1 添加log4j依赖2 使用代码配置并调用log  2.1 代码配置LogConfiguration.java  2.2 调用  2.3 结果3 ...

  9. 【转】PowerDesigner表结构和字段大小写转换

    [转自]http://blog.csdn.net/xysh1991/article/details/8016192 使用方法:进入PowerDesigner,打开一个PDM,在菜单栏找到:Tools ...

  10. C# 延时函数 非Sleep

    1.示例: using System.Runtime.InteropServices; [DllImport("kernel32.dll")] static extern uint ...