0

ポップアウト メニューを作成しようとしているので、ユーザーが 1 つのメニューにカーソルを合わせるたびに、ポップアップしてアイコンが色付きのアイコンに変わります。

いくつかのコードで在庫があります。

$('.box').hover(function() {
if(!$(this).data('open')){
    $(this).animate({ top: '-30px' }, 'slow', function() {});
} else {
    $('#.box').animate({ top: '50px' }, 'slow', function() {});
}

});

デモはこちら: http://jsfiddle.net/6jLFP/4/

あなたの編集の jsfiddle を私と共有できますか? 私は今本当に立ち往生しています。また、ホバー状態 (色付きのアイコン) が上に移動または飛び出している間、アクティブにする必要があります。

4

1 に答える 1

0

あなたは答えに近づいています。私はいくつかの変更を行います:

  • position:relativeあなたに1つ追加.box

    .box {
       position:relative;
    }
    
  • 2 つは機能を変更します。

    $('.box').hover(function() {
       $(this).animate({ top: '-30px' }, 'slow');
     }, function () {
       $(this).animate({ top: '0px' }, 'slow');
     });
    

このデモをチェックしてくださいhttp://jsfiddle.net/6jLFP/21/

CSS を使用してこれを行うこともできます。これを CSS ファイルに追加します。

.box {transition:all 1s ease-in;}
.box:hover {top:-50px;}

このデモを表示http://jsfiddle.net/6jLFP/27/ . ここでの唯一の問題は、互換性に関するものです。

于 2013-11-14T15:03:17.020 に答える