jQuery通过特定div生成动画

是否可以使用特定路径将对象从一个位置变为另一个位置？例如，在从pos1到pos2的动画制作中，如果在方法中存在带“no-ok”类的div，则不应该去那里，而应在其左侧，右侧，上方或下方找到最近的称为OK的div。如果没有叫好的div，它应该停止。以下图片说明：jQuery通过特定div生成动画

enter image description here

到目前为止，我只能从POS1动画到POS2，但我不知道如何检查是否有DIV没有确定的方式，以及如何找到与类一样的最近的div。

HTML：

<div class="container"> 
     <div id="pos1"></div> 
     <div class="ok"></div> 
     <div class="no-ok"></div> 
     <div class="ok"></div> 
     <div class="pos2"></div> 
    </div>

的jQuery：

$('.container').click(function(){ 
    var pos1 = $('#pos1').position(); 
    $(this).animate({ 'top': pos1.top + 'px', 'left': pos1.left + 'px'}, 200, function(){ 
     //end 
    }); 
});

来源

2012-08-09 user1355300

动画内在张力结构必须是这样的：

Here is jsFiddle to play with.

var pTop = parseInt($('.container').css('top')); 
var pLeft = parseInt($('.container').css('left')); 

$('.container').click(function(){ 
    var $this = $(this); 
    $this.stop().animate({'left': (pLeft * 2) + 'px'},1000,function(){ 
    //firt step = go 2x right 
     $this.stop().animate({'top': (pTop*3) + 'px'},2000,function() { 
     //second step = go 2x bottom 
      $('.container').animate({"left": "-=100px"},1000); 
      //third step = go begining left position 
     }); 
    }); 
});

来源

2012-08-09 10:19:20

感谢您的答案，但我的意思是可以有任何随机div类，所以它应该看看它是否有可能移动（例如。移动到只有类与'确定'） – user1355300 2012-08-09 10:59:00

我无法理解你的评论的问题，我只是做了我在你的排队图片上看到的。解释更多spesific或选择accpet答案，如果它工作队友。 – 2012-08-09 11:06:21

jQuery通过特定div生成动画

回答

相关问题