0

次のコードがあります。

http://jsfiddle.net/EMX4Q/

これは非常に簡単です。画像にマウスを合わせると、同じ画像が大きく表示されます。

Google の画像のような効果を実現したいと思います: https://www.google.com/search?q=image&oe=utf-8&client=ubuntu&channel=fs&um=1&ie=UTF-8&hl=es&tbm=isch&source=og&sa =N&tab=wi&ei=p6wJUKMpg7LbBfTszdMH&biw=1680&bih=615&sei=qawJUKfHI9Lr0QGOouiLBA

どうすればできますか?

4

1 に答える 1

2

time パラメータを使用して jQuery animate() または addClass()/removeClass() を使用します。これが私が使用した例です:

$('.circle').hover(
  function () {
    $(this).addClass('bigger-outer', 1000);
  }, 
  function () {
    $(this).removeClass('bigger-outer', 1000);
  }
);

そのため、ホバー時に円のクラスを持つものに対して、より大きな外側のクラスを追加/削除し、1000 ミリ秒または 1 秒にわたって遷移します。

于 2012-07-20T19:13:21.797 に答える