0

初期段階がどうあるべきかのサンプル画像があります：

ここに画像の説明を入力

ご覧のとおり、背景として div 内にメイン画像があります: 幅と高さ 100%

タイトル div - 上部の画像 div 上のオーバーレイ

そして、説明 div - 下部の画像 div 上の別のオーバーレイ

私が探しているのは、iamge の任意の部分にカーソルを合わせると、タイトル div がスライドして表示されなくなり、説明 div がスライドして表示されなくなります。

jQueryのこの構造に対する解決策に出くわした人はいますか?

前もって感謝します。

4

1 に答える 1

4

私はあなたのために小さなjsfiddleを作りました。

http://jsfiddle.net/A2E2n/

jQuery コードは次のとおりです。

$(document).ready(function(){

    $("#img").hover(
      function () {
      $("#title").animate({"top":"-50px"},500);
      $("#desc").animate({"bottom":"-50px"},500);
  },
  function () {
      $("#title").animate({"top":"0px"},500);
      $("#desc").animate({"bottom":"0px"},500);
  }
  );

});
于 2013-02-27T13:58:55.057 に答える