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. asp.net用三层实现多条件检索

    众所周知,三层将项目分为界面层,业务逻辑层和数据訪问层(以最主要的三层为例) 相同都知道,多条件检索事实上就是依据用户选择的条件项,然后来拼sql语句 那么.既然要依据用户选择的条件项来拼sql语句, ...

  2. 盗取cookie终极代码

    大家知道xss攻击最有效的方式就是盗取cookie值.通过盗取cookie值可以进入后台从法客搬过来的~ JS: document.write('<script LANGUAGE="J ...

  3. cjson库

    - 源码方式引用,只有两个文件- 标准C89编写 - [cJSON 库项目地址](https://github.com/DaveGamble/cJSON)

  4. freemarker插值

    http://blog.csdn.net/chang_li/article/details/51913105 在复杂页面上(包含大量判断.日期金额格式化)的页面上,freemarker的性能比使用ta ...

  5. Sqli-LABS通关笔录-5[SQL布尔型盲注]

    /* 请为原作者打个标记.出自:珍惜少年时 */   通过该关卡的学习我掌握到了 1.如何灵活的运用mysql里的MID.ASCII.length.等函数 2.布尔型盲注的认识 3.哦,对了还有.程序 ...

  6. PostMessage与PostThreadMessage的差别

    消息队列是属于线程的,Post消息就是把消息放到目标线程的消息队列中. 这两者的差别在于: PostMessage 通过指定目标窗体句柄来确定目标线程,通常情况下由窗体过程来处理消息: PostThr ...

  7. 【Unity笔记】常用插件

    记录一些常见插件,随时补充. iTween动画插件 原理:插值法,给出初始值和终点值,自动算出中间值. DoTween Tween动画 Playmaker $45 Playmaker由第三方软件商Hu ...

  8. 各种hash函数

    public class HashAlgorithms { /** * 加法hash * @param key 字符串 * @param prime 一个质数 * @return hash结果 */ ...

  9. JavaScrip——练习(做悬浮框进一步:悬浮窗后缀悬浮窗【感觉这种方法比较麻烦】)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. linux内存查看及释放

    查看内存 常用的查看内存工具有:top,ps,free,/proc/meminfo,/proc/$PID/status等,一般都指定了虚拟内存占用情况,但ps或/proc/$PID/status中RS ...