我已经创建了一个逻辑来通过在jQuery中使用for循环来自动增加图像的高度和宽度,但是我的图像
突然放大,不符合循环条件。请帮助我解决查询。

查询是:-图片大小应根据循环增加四倍

谢谢大家



$(function() {
        var plus = 50 ;
        var max = 4;

      setTimeout(function(){
        for(var i = 0; i < max; i++) {


        var height = 50;
        var width = 50;

        var  height = height + plus;
        var width = width + plus;

        plus +=  plus;

        $("#image").width(width).height(height);
      }


    }, 2000);


      });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<body>
    <div>
        <img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQnk1kzJCdN3FFDcjMIBSNc2YuBdCuc6A5Cpzg4LIDkMB15-mek" id="image"/>
    </div>

</body>

最佳答案

您将需要使用setInterval()clearInterval()

检查以下示例。



$(function() {
  var plus = 50;
  var max = 4;

  var timer = setInterval(function() {
    var height = 50;
    var width = 50;

    height = height + plus;
    width = width + plus;

    plus += plus;

    $("#image").width(width).height(height);

    if (plus >= 800)
      clearInterval(timer);

  }, 2000);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<body>
  <div>
    <img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcQnk1kzJCdN3FFDcjMIBSNc2YuBdCuc6A5Cpzg4LIDkMB15-mek" id="image" />
  </div>

</body>

关于javascript - jQuery动态图片大小变化,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/43046418/

10-12 13:16