0

jQuery の .animate 関数に問題があり、イージングと混合しています。

以下の作品;

$("#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

4

2 に答える 2

0

私はあなたのコードと一致するコードを持っています.

<!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-14T14:14:33.673 に答える
0

あなたのコードは問題なく動作するようです。

この効果が含まれている jQuery-UI をダウンロードしたことを確認してください。[効果] でこれを確認してください: http://jqueryui.com/download/

于 2013-05-14T14:00:56.777 に答える