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水平垂直居中的简单实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持小牛知识库。
-
问题内容： 我弹出一个包含ASP.NET表单的弹出窗口，单击链接“请求信息”，然后出现该表单。 但是，具有链接“请求信息”以触发弹出窗口的页面包含很多内容，因此需要滚动才能看到该链接。 如果用户滚动阅读内容，则需要始终居中，否则，如果他们不滚动，弹出窗口仍将居中显示在屏幕上。 在绝对定位，整个页面宽度与边距设置为。 问题答案： 如果div具有固定的宽度和高度，请使用：（如果width = 120p
-
问题内容： 有没有办法在 垂直和水平方向上输入一个DIV， 但这很重要， 当窗口小于内容时，内容将不会被剪切 。div必须具有背景色，宽度和高度。 我总是将div的中心定位为绝对位置和负边距，如提供的示例所示。但是它有一个问题，那就是削减内容的顶部。有没有一种方法可以将div.content居中而不会出现此问题？ CSS： HTML： 我的问题不是重复的“如何在水平和垂直方向上居中放置元素？”1-
-
我有个问题快把我逼疯了。 我有一个包装器，其中包含一个带有一些文本的div和一个图像。图像和div的大小各不相同。包装器div将调整为较大包装器的大小。 它们都应该垂直对齐，如下所示： 我偶然发现了这个帖子： http://www.jakpsatweb.cz/css/css-vertical-center-solution.html 正如你在小提琴上看到的： http://jsfiddle.net
-
问题内容： 如何使用flexbox在容器内水平和垂直居中div。在下面的示例中，我希望每个数字都彼此相邻（按行），并水平居中。 问题答案： 我认为您想要以下内容。 你的元素应该是块级（而非）如果你想要的高度和顶部/底部填充，以正常工作。 另外，在上，将宽度设置为而不是。 您的属性很好。 如果您希望垂直居中于视口中，请为和分配100％的高度，然后将页边距清零。 请注意，需要一个高度才能看到垂直对齐效
-
如何使用FlexBox在容器内水平和垂直地居中div。在下面的例子中，我希望每一个数字在彼此下面（在行中），水平居中。 null null http://codepen.io/anon/pen/zlxbo
-
我在父div中的图标居中（垂直和水平）存在问题。我的页面上有许多大小不同的父div，因此我希望能够按比例将图标放置在每个父div的中心。下面是一个JSFIDLE问题： JSFIDLE公司 HTML CSS