10

上の行に一連のカテゴリを表示するメニュー バーがあります。

カテゴリの 1 つに一連のサブカテゴリがあります。

サブメニューをslideDownし、マウスが離れるとslideUpするように、hoverIntentを設定しています。

ただし、このカテゴリのページを表示している場合は、アクティブなカテゴリが強調表示された状態でサブメニューが表示されるようにしたいと考えています。また、サブメニューがマウスを介して操作されたときに、マウスが離れると再びスライドアップしないようにしたいと思います。

このページの要素で hoverIntent 関数を再宣言しようとしましたが、機能しません。まだ以前のバインディングを使用しています。以前の hoverIntent のバインドを解除し、新しいものを使用することを確認する方法はありますか?

4

4 に答える 4

19

バインドおよびバインド解除するには、次のhoverIntentことを行う必要があります。

// bind the hoverIntent
$("#demo1 li").hoverIntent(makeTall, makeShort)
// unbind the hoverIntent
$("#demo1 li").unbind("mouseenter").unbind("mouseleave");
$("#demo1 li").removeProp('hoverIntent_t');
$("#demo1 li").removeProp('hoverIntent_s');
// rebind the hoverIntent
$("#demo1 li").hoverIntent(makeTall, makeShort)
于 2011-11-16T13:21:11.450 に答える
12

これはより完全な答えだと思います。次のことを行います。

  • アクティブなタイマーはすべてクリーンアップされます。
  • すべてのイベントがクリアされます
  • すべてのオブジェクト プロパティがクリアされます
  • 一般的な jQuery 構文を使用し、hoverIntent のネイティブ部分のように見えます

コード：

(function($) {
   if (typeof $.fn.hoverIntent === 'undefined')
     return;

   var rawIntent = $.fn.hoverIntent;

   $.fn.hoverIntent = function(handlerIn,handlerOut,selector) 
    {
      // If called with empty parameter list, disable hoverintent.
      if (typeof handlerIn === 'undefined')
      {
        // Destroy the time if it is present.
        if (typeof this.hoverIntent_t !== 'undefined') 
        { 
          this.hoverIntent_t = clearTimeout(this.hoverIntent_t); 
        }
        // Cleanup all hoverIntent properties on the object.
        delete this.hoverIntent_t;
        delete this.hoverIntent_s;

        // Unbind all of the hoverIntent event handlers.
        this.off('mousemove.hoverIntent,mouseenter.hoverIntent,mouseleave.hoverIntent');

        return this;
      }  

      return rawIntent.apply(this, arguments);
    };  
})(jQuery);
于 2013-06-04T15:00:13.413 に答える
1

jQuery docs から:「引数のない最も単純なケースでは、.unbind() は要素にアタッチされたすべてのハンドラーを削除します」

于 2012-06-24T13:58:10.567 に答える