2

我有一个长期的目标,我正在慢慢地朝着它前进,但我需要很多帮助,真的不知道我在做什么吗?

请看看这个小提琴:http: //jsfiddle.net/bloodygeese/vjU5b/27/

我的最终目标是让红色方块控制列表的位置,当方块向右旋转时(顺时针列表向下移动以在蓝色框区域内显示新的一行文本,然后当到达列表移动将被反转,正方形将向左旋转(逆时针),列表将向上滑动以在蓝色框中显示一行文本,我真正希望能够学习的是如何使用拖动用鼠标围绕红色方块旋转方块并上下滑动列表并对齐位置,使文本位于蓝色框内。

目前,当正方形旋转时,我无法让列表继续移动,它只移动一次,从那里我不知道如何让它反转或如何使用鼠标拖动来控制它。

任何指针/帮助将不胜感激。

4

3 回答 3

2

要让列表继续移动,您需要:

$('#list').animate({top : "+=20px"}, {duration:500})

代替

 $('#list').animate({top : "=120px"}, {duration:500})

第二个语句只会将其定位到 top:120px,而第一个语句会在每次单击时将位置递减 20px

为了改变方向,你可以这样做jsfiddle

于 2012-09-19T02:06:46.843 回答
1

您应该每次都更改列表顶部,如下所示:

var top = 120;

$(function(){
$('#box').click(function(){
    $('#list').animate({top : top + "px"}, {duration:500});
    top = top + 20;        
})
于 2012-09-19T02:06:55.763 回答
0

检查这个如何完成的小例子。我还没有写完整的代码..

小提琴

于 2012-09-19T02:27:46.013 回答