複数の.hoverアニメーション関数

Question

私は同じホバー機能でアニメートステートメントを組み合わせる方法を理解しようとしています。

基本的には、私がdivの上にマウスを置くと、新しいイメージが差し込まれて右にスライドするイメージがあります。ここで

は、私がこれまで持っているコードです：

//Set div dimensions equal to image's dimensions: 
$('#image_holder').width($('#image_1').width()); 
$('#image_holder').height($('#image_1').height()); 

//tell the browser what to do when hovering on the div: 

$('#image_holder').hover(function() { 
//when mouse hover: 
$('#image_0').animate({right: '-' + $(this).width() + 'px'}, /*duration*/360, /*ease*/'swing');  
$('#image_1').animate({right: '0px'}, /*duration*/360, /*ease*/'swing'); 
}, 

function() { 
//when mouse out, no hover: 
    $('#image_0').animate({right: '0px'}, /*duration*/360, /*ease*/'swing'); 
    $('#image_1').animate({right: '-' + $(this).width() + 'px'}, /*duration*/360, /*ease*/'swing'); 
}); 

そして、私のHTMLは非常に簡単です：、今引き出しん最初の画像（image_0）が、第二の画像

<div id="image_holder" class="image_holder"> 
    <img id="image_0" class="image" src="images.png" /> 
    <img id="image_1" class="image" src="images_hover.png" /> 
</div> 

（image_1）は挿入されません。私はそれが単純なものであると感じています。

ご迷惑をおかけして申し訳ありません。

ありがとうございました。

Answer 1

それはここで働いているようだ。ここではhttp://jsfiddle.net/maniator/XevTC/1/

は、私はあなたががしたいと思う何かのアップデートです：http://jsfiddle.net/maniator/XevTC/2/（しかし、私は常に間違っている可能性が）

---

私はこのことを考えますあなたが意図したものです：http://jsfiddle.net/maniator/XevTC/11/

Answer 2

EDIT

Nealの答えを確認すると、コードが機能しているようです。

しかし、あなたの質問を読んでみると、あなたはthisのようなものが欲しいのですか？