单击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' );
};
});
});
JSFiddle
关于javascript - 根据值更改jquery.animate,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/25853572/