0

私はli要素を持っています：

<ul>
  <li><a href="">test 1</a></li>
  <li><a href="">test 2</a></li>
</ul>

下から新しい色が来るように、ホバーで色をアニメートしたいと思います。

どうやってするの？

4

1 に答える 1

1

色に animate() 機能を提供するには、このjQuery PlugInを使用する必要があります。

使用例 (github ページからコピー!)

<!DOCTYPE html>
<html>
<head>
  <style>
    div {
      background-color:#bada55;
      width:100px;
      border:1px solid green;
    }
  </style>
  <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
  <script src="jquery.color.min.js"></script>
</head>
<body>
  <button id="go">Simple</button>
  <button id="sat">Desaturate</button>
  <div id="block">Hello!</div>
  <script>
    $("#go").click(function(){
      $("#block").animate({
        backgroundColor: "#abcdef"
      }, 1500 );
    });

    $("#sat").click(function(){
      $("#block").animate({
        backgroundColor: $.Color({ saturation: 0 })
      }, 1500 );
    });
  </script>
</body>
</html>
于 2012-05-19T20:16:37.433 に答える