0

誰かが私のページの画像にカーソルを合わせたときに、この単純な jQuery 効果を作成するにはどうすればよいですか?

JSFiddle の例は、ここにあります。

ここに画像の説明を入力

誰かが画像またはボックスの一部に入ると、テキスト領域が拡大して詳細が表示されるようにしたい.

マウスを離すと、テキスト領域が縮小され、画像のみが表示されるようになります。

これが私の試みです：

$("#free-roster .roster-container .champion").mouseenter(function () {
    $(this).find(".info").animate({ width: "116px" }, 400);
});

$("#free-roster .roster-container .champion").mouseleave(function () {
    $(this).find(".info").animate({ width: "0px" }, 400);
});
4

1 に答える 1

0

このjQueryは私のために働きます：

$("#free-roster .roster-container .champion").mouseenter(function () {
    $(this).find(".info").animate({ width: "116px" }, 400);
});

$("#free-roster .roster-container .champion").mouseleave(function () {
    $(this).find(".info").animate({ width: "0px" }, 400);
});

$("#free-roster .roster-container .champion").mouseleave();

CSS に以下を追加します。

color: white;

に：

#free-roster .roster-container .champion .info

http://jsfiddle.net/9EFsE/1/

于 2012-04-10T02:49:19.723 に答える