我已经创建了一个逻辑来通过在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/