javascript - jQuery - 左边距减去 div 宽度的一半

Question

我想实现这样的目标：

我有一个没有指定宽度的 div，所以它会根据它所拥有的内容而变化。首先，我想计算那个 div 的宽度。之后，我想用 jquery 添加 css 样式，这将使该 div 左边一半的宽度。所以，如果 div 的宽度是 300px，我希望这个 css 添加到同一个 div 中：

margin-left: -150px;

我希望我很清楚。非常感谢。

Answer 1

使用此代码：

// get div width
var width = $('div').width();

// calculate margin size
var marginLeft = width / 2;

// set css
$('div').css('margin-left', -marginLeft);

Answer 2

var w = $("#left-shunted-div").width();
var left_mar = -(w/2);
$("#left-shunted-div").css("margin-left",left_mar);

Answer 3

你可以简单地这样做：

// After dom load
$(function(){
    // Select the div
    var div = $('#myDiv');
    // Get the width;
    var width = div.outerWidth();
    // Change the margin-left to half negative 
    div.css({'marginLeft' : -(width / 2) + 'px'});
});