使用 jquery 更改背景大小

Question

我想将图像的背景大小更改为用户想要的宽度和高度。

我有一个表单，用户可以在其中输入正确的宽度和高度

   <input type="text" class="form-control input-width input-px" maxlength="2" name="width">PX breed
   <input type="text" class="form-control input-height input-px" maxlength="2" name="height">PX hoog

如果输入发生变化，我想将背景大小更改为输入字段的值

      $(".input-px").on("change", function()
      {

          width = $(".input-width").val()+"px";
          height = $(".input-height").val()+"px"

          $(".source").css("background-size", width + height );

      })

我没有收到任何错误，但它也没有更改 width/height。

Answer 1

我认为你应该这样做：

$(".source").css("background-size", width + ', ' + height );

你这样做的方式是，你在计算宽度和高度的总和，在 css 中，背景大小需要 2 个数字，用逗号分隔。

Answer 2

我认为您在背景大小的文本输入中缺少 space。

$(".source").css("background-size", width + " " + height );

使用 jquery 更改背景大小

Change background-size with jquery

jquery

background-size