jquery计算出left和top,让一个div水平垂直居中的简单实例
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水平垂直居中的简单实例的更多相关文章
- css进阶 04-如何让一个元素水平垂直居中?
04-如何让一个元素水平垂直居中? #前言 老板的手机收到一个红包,为什么红包没居中? 如何让一个子元素在父容器里水平垂直居中?这个问题必考,在实战开发中,也应用得非常多. 你也许能顺手写出好几种实现 ...
- 用css让一个容器水平垂直居中
阅读目录 方法一:position加margin 方法二: diaplay:table-cell 方法三:position加 transform 方法四:flex;align-items: cente ...
- 如何用css让一个容器水平垂直居中
方法一: 以前设置里面的绿div总是会使用{position:absolute;left:50%;top:50%;margin-left:-div宽度的一半;margin-top:-div高度的一半} ...
- 公司的一个面试题:如何用css让一个容器水平垂直居中?
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 七种css方式让一个容器水平垂直居中
阅读目录 方法一:position加margin 方法二: diaplay:table-cell 方法三:position加 transform 方法四:flex;align-items: cente ...
- 如何让一个DIV水平,垂直方向都居中于浏览器?
<style type="text/css"><!-- div {position:absolute;top:50%;left:50%;margin:-150px ...
- 如何让一个div水平和垂直居中对齐
以下方法来自百度知道:https://zhidao.baidu.com/question/558984366971173044.html 方法1: .parent { width: 800px; he ...
- DIV在另一个DIV里面垂直居中,水平居中
HTML: <div class="parent"> <div class="children"> <div class=&quo ...
- 关于页面布局中,如何让一个div水平和垂直居中的五个方案
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- asp.net用三层实现多条件检索
众所周知,三层将项目分为界面层,业务逻辑层和数据訪问层(以最主要的三层为例) 相同都知道,多条件检索事实上就是依据用户选择的条件项,然后来拼sql语句 那么.既然要依据用户选择的条件项来拼sql语句, ...
- 盗取cookie终极代码
大家知道xss攻击最有效的方式就是盗取cookie值.通过盗取cookie值可以进入后台从法客搬过来的~ JS: document.write('<script LANGUAGE="J ...
- cjson库
- 源码方式引用,只有两个文件- 标准C89编写 - [cJSON 库项目地址](https://github.com/DaveGamble/cJSON)
- freemarker插值
http://blog.csdn.net/chang_li/article/details/51913105 在复杂页面上(包含大量判断.日期金额格式化)的页面上,freemarker的性能比使用ta ...
- Sqli-LABS通关笔录-5[SQL布尔型盲注]
/* 请为原作者打个标记.出自:珍惜少年时 */ 通过该关卡的学习我掌握到了 1.如何灵活的运用mysql里的MID.ASCII.length.等函数 2.布尔型盲注的认识 3.哦,对了还有.程序 ...
- PostMessage与PostThreadMessage的差别
消息队列是属于线程的,Post消息就是把消息放到目标线程的消息队列中. 这两者的差别在于: PostMessage 通过指定目标窗体句柄来确定目标线程,通常情况下由窗体过程来处理消息: PostThr ...
- 【Unity笔记】常用插件
记录一些常见插件,随时补充. iTween动画插件 原理:插值法,给出初始值和终点值,自动算出中间值. DoTween Tween动画 Playmaker $45 Playmaker由第三方软件商Hu ...
- 各种hash函数
public class HashAlgorithms { /** * 加法hash * @param key 字符串 * @param prime 一个质数 * @return hash结果 */ ...
- JavaScrip——练习(做悬浮框进一步:悬浮窗后缀悬浮窗【感觉这种方法比较麻烦】)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- linux内存查看及释放
查看内存 常用的查看内存工具有:top,ps,free,/proc/meminfo,/proc/$PID/status等,一般都指定了虚拟内存占用情况,但ps或/proc/$PID/status中RS ...