0

下にcssが投稿された、情報ボックスが重ねられた画像があります。

通常は、画像にカーソルを合わせるとこれが表示されますが、私はその逆が必要です。画像にカーソルを合わせると、ボックスが約-50pxスライドアウト/ダウンします。誰かがこれについてのヒントを得ましたか？

.imgTitleInfoTop {
    -moz-box-sizing: border-box;
    bottom: 0;
    font-size: 24px;
    font-weight: 500;
    height: 60px;
    line-height: 22px;
    width: 370px;
}
4

2 に答える 2

1

私が理解しているように、画像にカーソルを合わせたときに .imgTitleInfoTop 要素を非表示にする必要があるため、コードは次のようになります。

<script type="text/javascript">
 $('.yourImage').hover(function() {
  $(.imgTitleInfoTop).animate({
   height: 0
  }, 300);
 }, function() {
  $(.imgTitleInfoTop).animate({
   height: '60px'
  }, 300);
 });
</script>

(300 はミリ秒単位の時間で、このアクションにかかる時間なので、速くしたり遅くしたりできます)

于 2013-06-20T10:16:38.243 に答える