Jquery 如何连续减去两个移动div的左边?
我试图减去两个移动div的Jquery 如何连续减去两个移动div的左边?,jquery,html,css,Jquery,Html,Css,我试图减去两个移动div的left值,我能够使用setInterval连续计算它们的left,但当我试图减去它们的值时,它显示错误NaN HTML JQuery setInterval(function(){ var x=$('#a').css('left'); var y=$('#b').css('left'); $('#z').text(x); $('#y').text(y); }); setInterval(function(){ var a=parseInt($('#z').text
left
值,我能够使用setInterval
连续计算它们的left
,但当我试图减去它们的值时,它显示错误NaN
HTML
JQuery
setInterval(function(){
var x=$('#a').css('left');
var y=$('#b').css('left');
$('#z').text(x);
$('#y').text(y);
});
setInterval(function(){
var a=parseInt($('#z').text() , 10);
var b=parseInt($('#x').text() , 10);
var c= a - b ;
$('#x').text(c);
});
打字错误:在
var b=parseInt($('#x').text(),10)中用y替换x代码>
请参阅更新的小提琴:
再次阅读,由于您的代码过于复杂,我可能错过了准确的逻辑错误
简化代码(包装在加载页面元素后执行的函数中):
你可以通过记录变量的值来发现这一点:)@sodawillow我用parseInt
试过,但没有找到整数。我可以发誓我试过,但有点不同
#a{
-webkit-animation:mv 10s infinite;
left:250px;
width:100px;
height:100px;
background:green;
position:absolute;
}
#b{
position:absolute;
-webkit-animation:mvs 10s infinite;
z-index:10;
width:100px;
height:100px;
background:red;
}
@-webkit-keyframes mv{
0%{left:100px;}
50%{left:500px;}
100%{left:250px;}
}
@-webkit-keyframes mvs{
0%{left:0;}
50%{left:600px;}
100%{left:0px;}
}
setInterval(function(){
var x=$('#a').css('left');
var y=$('#b').css('left');
$('#z').text(x);
$('#y').text(y);
});
setInterval(function(){
var a=parseInt($('#z').text() , 10);
var b=parseInt($('#x').text() , 10);
var c= a - b ;
$('#x').text(c);
});
$(function() {
setInterval(function(){
var x = parseInt($('#a').css('left'), 10);
var y = parseInt($('#b').css('left'), 10);
var c = x - y ;
$('#x').text(c);
});
});