JS-----元素定位自动居中

最新推荐文章于 2025-05-17 10:58:06 发布

原创最新推荐文章于 2025-05-17 10:58:06 发布 · 2.4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#定位居中

JScript.Jquery 专栏收录该内容

81 篇文章

订阅专栏

本文介绍了一种使用jQuery实现网页元素自动居中的方法。通过设置绝对定位，并调整外边距，可以使元素在页面上水平垂直居中显示。适用于需要快速实现元素居中的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

元素定位自动居中 .html

<div class="dialoge-set">
</div>

元素定位自动居中 .js

//元素定位自动居中
	jQuery.fn.center = function() {
		this.css("position", "absolute");
		this.css("top","50%");
		this.css('left',"50%");
		this.css("margin-top", -(this.innerHeight()) / 2 + "px");
		this.css("margin-left", -(this.innerWidth()) / 2 + "px");
		return this;
	}
	
	//弹窗其他设置
	$('.dialoge-set').center();