jquery - 하나의 동작으로 두 요소에 애니메이션 적용

Question

이미지가 배경 위로 슬라이드하고 배경이 너무 흐리게 움직이는 시차 효과를 만들려고합니다. jQuery로 가능합니까? 애니메이션과 함께 두 요소를 ID로 참조하려고했지만 작동하지 않습니다.

http://jsfiddle.net/rYYDv/ 여러분의 도움에 감사드립니다 : 여기에

  $(document).ready(function() { 
       var timer; 

       $("#leftarrow").hover(function() { 
        timer = setInterval(function() {slideLeft();}, 50); 
       }, function() { 
        clearInterval(timer); 
       }); 


      $("#rightarrow").hover(function() { 
        timer = setInterval(function() {slideRight();}, 50); 
       }, function() { 
        clearInterval(timer); 
       }); 



      function slideLeft() { 
       $("img#background").stop().animate({ 
        'left': '-=200px' 
       }, 50); 
       $(".mid").stop().animate({ 
        'left': '-=20px' 
       }, 50); 

      } 

      function slideRight() { 
       $("img#background").stop().animate({ 
        'left': '-=200px' 
       }, 50); 
       $(".mid").stop().animate({ 
        'left': '+=20px' 
       }, 50); 
      } 


      }); 

는 바이올린입니다.

Answer 1

배경에 img 태그를 사용하는 대신 div 안에 이미지를 설정하고 이에 따라 div를 조정하십시오.

내 구현은 다음과 같습니다. - jsfiddle