jQuery 이미지가 마우스를 올리면 회전합니다.

Question

마우스를 올리면 이미지 src가 바뀔 수 있으며 최대 10 개까지 다시 계산할 수 있습니까?

이것은 내가 원하는 것입니다.이 값은 기본 손가락입니다. flv-3.jpg! 마우스 호버에

<img src="/thumbs/e/b/d/6/d/ebd6d2d6d99e/ebd6d2d6d99e.flv-3.jpg" /> 

은 수에게

• FLV-1.JPG
• FLV-2.JPG
• FLV-3.JPG
• FLV-4.jpg을 변경해야
• 등 t까지

10 오, 다시 다시와 숫자 1부터 시작,하지만 난 엄지 손가락에서 마우스를 이동할 때,하지만하지 아주 좋은 솔루션 이제 엄지 손가락 FLV-3.JPG

에게이 어떤 메신저 사용을 기본으로 백업해야

var _thumbs = new Array(); 
function changeThumb(index, i, num_thumbs, path) 
{ 
    if (_thumbs[index]) 
    {   
     document.getElementById(index).src = path + i + ".jpg"; 

     preload = new Image(); 
     preload_image_id = (i + 1 > num_thumbs) ? 1 : i + 1; 
     preload.src = path + preload_image_id + ".jpg"; 
     i = i % num_thumbs; 
     i++; 
     setTimeout("changeThumb('" + index + "'," + i + ", " + num_thumbs + ", '" + path + "')", 800) 
    } 
}  
function startThumbChange(index, num_thumbs, path) 
{  
    if (num_thumbs < 2) return false; 
    _thumbs[index] = true; 
    changeThumb(index, 1, num_thumbs, path); 
} 
function endThumbChange(index, image) 
{ 
    _thumbs[index] = false; 
    document.getElementById(index).src = image; 
} 

및 HTML

<img onmouseout="endThumbChange('515e9279d96c6', '/thumbs/e/b/d/6/d/ebd6d2d6d99e/ebd6d2d6d99e.flv-3.jpg');" onmouseover="startThumbChange('515e9279d96c6', '10', '/thumbs/e/b/d/6/d/ebd6d2d6d99e/ebd6d2d6d99e.flv-','.jpg');" id="515e9279d96c6" src="/thumbs/e/b/d/6/d/ebd6d2d6d99e/ebd6d2d6d99e.flv-3.jpg" class="img"> 

그리고 또한 엄지 손가락이 변경 될 때 페이드와 같은 효과를 추가 할 수?

Answer 1

가변 타이머; 여기

$('div.settingsButton').hover(function() { 

var angle = 0, 
    $this = $(this); 

timer = setInterval(function() { 
    angle += 4; 
    $this.rotate(angle); 
}, 50); 
}, 
function() { 

timer && clearInterval(timer); 
$(this).rotate(0); 

는 fiddle