将CSS值设置为javascript变量

Question

好的，我想要一个CSS值，例如width：50％;是一个以像素定义的变量。让我们说50％宽度可能是1000px，或500px。我希望javascript检测百分比的像素值。

我已经多次试过，绝对没有运气。

Answer 1

您可以使用jquery执行此操作。

var width = $('#your_id').width();

示例

＆＃13;

＆＃13;

var width = $('#myDiv').width();
alert(width + 'px');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="width: 200px;">
    <div id="myDiv" style="width: 50%;"></div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

var total_width = $( window ).width();
var display_width = 50; //50%
var my_width_px = ((display_width * total_width) / 100); // 100 = 100%

这可能会对您有所帮助。

Answer 3

您可以使用jQuery

获取宽度（以像素为单位）

var width = $('#mydivid').width();

使用jQuery

设置div的宽度

$("#mydivid").css("width", your_new_width);

使用javascript获取宽度

document.getElementById("mydivid").offsetWidth;