Question

我是jQuery的初学者我不知道为什么我的动画不起作用这是我的剧本我还创建了一个小提琴，以防我的CSS出现问题链接到我的fiddle

$(document).ready(function(){
    $("#next").on('click',function(){
        var block=$("#moving_box1");
        block.animate({left:250px},"slow","linear",function(){
            alert("yehi");
        });
    });
});

Answer 1

我找到了这个问题。问题在于<div id="#next">将此替换为<div id="next">。同样在jQuery中你没有添加引用'left': '250px'所以我也添加了它。

我已经更新了代码。请点击这里：

$(document).ready(function(){
$("#next").on('click',function(){
    var block=$("#moving_box1");
    block.animate({'left': '250px'},"slow","linear",function(){
        alert("yehi");
    });
});
});

#box{
	display:block;
	width:1060px;
	align:center;
	height:400px;
	padding:2px;
	margin:2px;
	border:1px solid red;
	
	
}
#moving_box1{
	display:block;
	position:relative;
	left:0px;
	width:300px;
	height:350px;
	padding:2px;
	margin:4px;
	border:1px solid red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="box">
 <div id="moving_box1">
 </div>
 <div id="next">
 <p>Next</p>
 </div>
 </div>

我的jquery动画无效

1 个答案: