내 사이트에 3 개의 div 상자를 약간 띄우고 마우스를 올려 놓을 때까지 천천히 '가리 키기'를 원합니다. 그런 다음 내 사용자 정의 호버 효과가 이미 사용하고 있습니다. (흔들림/덜거덕 거림 및 불투명도). 그러나 나는 약간의 애니메이션을 얻는 방법에 대해 잘 모르겠다.div 상자 주위를 약간 떠 다니는 것
여기 내가 내 피들과 어울리는 곳이야 - 내가 뭘 놓친 거니?
내 사이트에 3 개의 div 상자를 약간 띄우고 마우스를 올려 놓을 때까지 천천히 '가리 키기'를 원합니다. 그런 다음 내 사용자 정의 호버 효과가 이미 사용하고 있습니다. (흔들림/덜거덕 거림 및 불투명도). 그러나 나는 약간의 애니메이션을 얻는 방법에 대해 잘 모르겠다.div 상자 주위를 약간 떠 다니는 것
여기 내가 내 피들과 어울리는 곳이야 - 내가 뭘 놓친 거니?
당신은 당신의 예에서 기간을 지정하지 않았습니다. 지금까지 div의 천천히 다음과 같이 애니메이션을 무작위 상단 반복 애니메이션과 왼쪽 값을 적용 할 수있는, 주위에 플 로트 만들기로 :
$(function() {
var timeout;
function moveAimlessly() {
$(".aimless").each(function() {
$(this).stop().animate({
top: Math.floor(Math.random()*2) == 1 ? "+=" + Math.floor(Math.random()*41).toString() : "-=" + Math.floor(Math.random()*41).toString(),
left: Math.floor(Math.random()*2) == 1 ? "+=" + Math.floor(Math.random()*41).toString() : "-=" + Math.floor(Math.random()*41).toString()
}, 4000);
});
timeout = setTimeout(moveAimlessly, 4000);
}
moveAimlessly();
$(".aimless").on("hover", function() {
clearTimeout(timeout);
$(".aimless").stop();
});
});
예를 링크 : http://jsfiddle.net/7zZEG/1/
그게 최고,하지만 수 있도록하는 방법은 무엇입니까 호버가 떠난 후 사업부가 계속 떠돌아 다녔습니까? –
@ cam77 물론,'$ (". aimless"). on ("hover", function() {...'. –