jquery - 如何通过更改值的 jquery 动态应用 css？

Question

我正在尝试根据用户的屏幕分辨率将宽度应用于“div”。为此，我使用下面的 jquery 代码:

$(function() {
  var resolution = $(window).width();
  var new_width = resolution - 17;
  new_width = new_width + "px";
  $("#box").css("width", new_width);
});

我正在尝试动态更改宽度，但它不起作用。

如果我使用 $("#box").css("width", "500px"); 它将生效并将宽度设置为 500px 但如果我使用 new_width 而不是 500px 它不会改变 div 的宽度。
我该如何解决？

Answer 1

动态，你的意思是调整大小？然后你需要 resize event :

$(window).resize(function() {
    var resolution = $(window).width();
    var new_width = resolution - 17;
    $("#box").css("width", new_width + "px");
});