当点击button.btn
时,div.img-box
会随着动画移动。
我想根据 div.img-box
的位置更改动画。
首先,我单击按钮,它会集体移动。
第二次单击时,margin-right
现在为 10px 的图像不会移动。
我有这个代码。
js
$(function(){
var mr = parseInt($('.img-box').css('margin-right'), 10);
$(".btn").click(function(){
if (mr == 10) {
$(".img-box").animate( { marginRight: '300px' }, 'slow' );
} else {
$(".img-box").animate( { marginRight: '10px' }, 'slow' );
};
});
});
html
<button class="btn"></button>
<div class="img-box"><img src="xxx.png"></div>
CSS
.img-box{
float: right;
width: 250px;
height: 350px;
margin: 200px 25%;
}
如何修复它?
最佳答案
您需要将 var mr = parseInt($('.img-box').css('margin-right'), 10);
放入 click()
函数。
$(function(){
$(".btn").click(function(){
var mr = parseInt($('.img-box').css('margin-right'), 10);
if (mr == 10) {
$(".img-box").animate( { marginRight: '300px' }, 'slow' );
} else {
$(".img-box").animate( { marginRight: '10px' }, 'slow' );
};
});
});
关于javascript - 根据值更改 jquery.animate,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25853572/