JQ自定义运动问题?初级

[haorenge]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<title>Examples</title>
<style type="text/css">
	*{padding: 0;margin: 0;}
	li{list-style: none;}
	#box{
		width: 410px;
		height: 320px;
		margin: 30px auto;
	}
	#box li{
		width: 180px;
		height: 160px;
		overflow: hidden;
		border: 1px solid red;
		float: left;
		margin: 5px;
		position: relative;
	}
	#box li div{
		position: absolute;
		top: 0;
		left: 0;
	}

</style>
</head>
<body>
<script type="text/javascript">
$(function(){
	setInterval(function(){
		var num=Math.random()>0.5?160:-160;
		var num2=Math.floor(Math.random()*3);
		var ThisTop=$('#box ul li div').eq(num2).position().top;
		if(ThisTop==0){
			$('#box ul li div').eq(num2).stop().animate({'top':'-=160px'}, 300)
		}else if(ThisTop==-320){
			$('#box ul li div').eq(num2).stop().animate({'top':'+=160px'}, 300)
		}else{
			$('#box ul li div').eq(num2).stop().animate({'top':'+='+num}, 300)
		}
		//我想要的方法
		//$('#box ul li div').eq(num2).animate('top':function(){
		// if(){return ...} 为什么不行?还是我的格式有问题	
		// })


		

	},1500)
	



})
</script>
<div id="box">
	<ul>
		<li>
			<div>
				<img src="images/001.gif" alt="" />
				<img src="images/002.gif" alt="" />
				<img src="images/003.gif" alt="" />
			</div>
		</li>
		<li>
			<div>
				<img src="images/004.gif" alt="" />
				<img src="images/005.gif" alt="" />
				<img src="images/006.gif" alt="" />
			</div>
		</li>
		<li>
			<div>
				<img src="images/007.gif" alt="" />
				<img src="images/008.gif" alt="" />
				<img src="images/009.gif" alt="" />
			</div>
		</li>
	</ul>
</div>   
</body>
</html>

刚学JQ不久 求指导.

[豪情]

看api， animate的回调不是这么用的。

.animate({'top':'-=160px'}, 300, function(){
    // do
})

[haorenge]

引用 1 楼 jikeytang 的回复:

看api， animate的回调不是这么用的。

.animate({'top':'-=160px'}, 300, function(){
    // do
})

那不是回调啊 我是想 top 的 值 引号后面的函数里判断

[天际的海浪]

引用 2 楼 haorenge 的回复:

[quote=引用 1 楼 jikeytang 的回复:] 看api， animate的回调不是这么用的。

.animate({'top':'-=160px'}, 300, function(){
    // do
})

那不是回调啊 我是想 top 的 值 引号后面的函数里判断 [/quote]

$(function(){
	setInterval(function(){
		var num=Math.random()>0.5?160:-160;
		var num2=Math.floor(Math.random()*3);
		var ThisTop=$('#box ul li div').eq(num2).position().top;
		$('#box ul li div').eq(num2).stop().animate({'top':ThisTop==0?'-=160px':ThisTop==-320?'+=160px':'+='+num}, 300)
		

	},1500)
})

[haorenge]

引用 3 楼 jslang 的回复:

[quote=引用 2 楼 haorenge 的回复:] [quote=引用 1 楼 jikeytang 的回复:] 看api， animate的回调不是这么用的。

.animate({'top':'-=160px'}, 300, function(){
    // do
})

那不是回调啊 我是想 top 的 值 引号后面的函数里判断 [/quote]

$(function(){
	setInterval(function(){
		var num=Math.random()>0.5?160:-160;
		var num2=Math.floor(Math.random()*3);
		var ThisTop=$('#box ul li div').eq(num2).position().top;
		$('#box ul li div').eq(num2).stop().animate({'top':ThisTop==0?'-=160px':ThisTop==-320?'+=160px':'+='+num}, 300)
		

	},1500)
})

[/quote] 又学了一招.谢谢. 不过还有个问题 ,那个后面为什么不能用函数来返回呢?

[wz_307]

可以用函数来返回, 这样做: top: (function(){if(){return ...}})() 之前无效是因为你给top赋值赋了一个函数对象, 而这个函数并未执行. 所以加上(function(){})()就可以将它执行, 获取返回值了

[天际的海浪]

引用 4 楼 haorenge 的回复:

[quote=引用 3 楼 jslang 的回复:] [quote=引用 2 楼 haorenge 的回复:] [quote=引用 1 楼 jikeytang 的回复:] 看api， animate的回调不是这么用的。

.animate({'top':'-=160px'}, 300, function(){
    // do
})

那不是回调啊 我是想 top 的 值 引号后面的函数里判断 [/quote]

$(function(){
	setInterval(function(){
		var num=Math.random()>0.5?160:-160;
		var num2=Math.floor(Math.random()*3);
		var ThisTop=$('#box ul li div').eq(num2).position().top;
		$('#box ul li div').eq(num2).stop().animate({'top':ThisTop==0?'-=160px':ThisTop==-320?'+=160px':'+='+num}, 300)
		

	},1500)
})

[/quote] 又学了一招.谢谢. 不过还有个问题 ,那个后面为什么不能用函数来返回呢?[/quote] .animate()并不支持这种语法 attr（）和css（）到是支持 .attr( attributeName, function(index, attr) ) .css( propertyName, function(index, value) )