2010-01-08 3 views
2

이 작업을 수행 할 수 있습니까? 기본적으로 저는 절대 위치 이미지를 오른쪽으로 움직이기 원합니다 : xxxPX, let 's say. 음, 애니메이션이 진행 중일 때 "트레일 (trail)"효과를 추가 할 수 있습니까?jQuery의 트레일 효과?

감사합니다,이 일을해야

+0

"흔적"어떻게? 당신은 더 구체적 일 수 있습니까? – jrharshath

+0

Windows 커서 "트레일 효과"와 비슷합니까? –

+1

제임스 굿윈, 그렇습니다, 그처럼 – Adrian

답변

5

애드리안 :

var box = $('#box'), 
    // Create some clones (these make up the trail) 
    clones = $.map(Array(10), function(item, i){ 
     return box.clone().css('opacity', 1/(i + 1)).hide().insertAfter(box); 
    }); 

box.animate({ 
    top: 100, 
    left: 200 
}, { 
    duration: 1000, 
    step: function(now, fx) { 

     // On each step, set a timeout for each clone, 
     // making it move to the required position. 

     var prop = fx.prop; 

     $.each(clones, function(i, clone){ 
      clone = $(clone).show(); 
      setTimeout(function(){ 
       clone.css(prop, now); 
      }, 50 * i); 
     }); 

    } 
}); 

데모 : http://jsbin.com/ifobe3

+0

그냥 내가 뭘 찾고 있었습니까, 감사합니다 J-P! – Adrian

+0

최고! 이제 상자를 페이지 내에서 마우스를 따라 가며 흔적을 남겨 두는 것은 어떻습니까? – aalaap