jQuery .animate easing issues

jQuery의 .animate 함수에 문제가 있고 easing과 혼합하고 있습니다.jQuery .animate easing issues

다음 작품;

$("#PanelOne").mouseover(function() { 
     $("#PanelTwo").stop(true, false).animate({ marginLeft: "420px"}, 150); 

});

하지만 그렇지 않습니다.

$("#PanelOne").mouseover(function() { 
     $("#PanelTwo").stop(true, false).animate({ marginLeft: "420px"}, 150, 'easeOutQuint'); 

});

나는 내가 잘못 정확히 모르겠지만, 눈부시게 분명 뭔가있을거야,하지만 난 완화 또는 jQueryUI 이전에 사용한 적이, 그래서 나는 꽤 잃었어요!

편집 : 여기 jQueryUI를 참조하고 있습니다.

http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js

출처

2013-05-14 Guy Meurice

당신이 JQuery와 UI의 효과를 포함나요? http://jqueryui.com/download/ – Yeronimo

문서에서 : "jQuery 라이브러리의 유일한 여유 구현은 스윙이라고하는 기본값과 선형이라고하는 일정한 속도로 진행되는 것입니다. 더 많은 여유 기능을 사용할 수 있습니다. 플러그인 사용, 특히 jQuery UI 제품군. " – j08691

여기에서 작동 : http://jsfiddle.net/4vCjn/ –

코드는 잘 작동하는 것 같다.

이 효과가 포함 된 jQuery-UI를 다운로드했는지 확인하십시오. 여기 효과에 따라이 옵션을 선택합니다 : http://jqueryui.com/download/

출처

2013-05-14 14:00:56 Broxzier

네, 지금이 방법이 도움이 될 것입니다. –

Google에서 라이브러리를 참조하고 있지만 잘못된 주소가 있어야합니다. jQueryui.com에서 참조하는 것이 아니므로 정상적으로 작동합니다. 감사! –

다행이 당신을 도왔습니다. – Broxzier

을 내가 너의 내 코드 일치를 가지고, 그것은 U를 들어 Helpfull 될 것입니다 희망 ..

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
    div { background:yellow; border:1px solid #AAA; width:80px; height:80px; margin:0 5px; float:left; } 
    div.colored { background:green; } 
    </style> 
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
</head> 
<body> 
    <div id="PanelOne"><img src="http://www.clipartguide.com/_small/0808-0710-1516-1324.jpg" width="85px" height="81px"></div> 
    <div id="mover"><img src="http://www.alissweettreats.com/i//Smiley_Face.jpg" width="85px" height="81px"></div> 
    <div><img src="download2.jpg" width="85px" height="81px"></div> 
<script> 

    $("#run").click(function(){ 
     $("div:animated").toggleClass("colored"); 
    }); 
    function animateIt() { 
     $("#mover").slideToggle("slow", animateIt); 
    } 
    animateIt(); 

    $("#PanelOne").mouseover(function() { 
    alert('Its Working'); 
     $("#mover").stop(true, false).animate({ marginLeft: "420px"}, 150, "easeOutQuint"); 
     }); 
</script> 

</body> 
</html>

출처

2013-05-14 14:14:33

jQuery .animate easing issues

답변

관련 문제