1

jQuery UI ツールチップに関する問題に遭遇しました。ドキュメント全体にツールチップを追加し、いくつかのスタイルを適用しました。

$( document ).tooltip({
    position: {
        my: "center top+20",
        at: "center bottom",
        using: function( position, feedback ) {
            $( this ).css( position );
            $( "<div>" )
            .addClass( "arrow" )
            .addClass( feedback.vertical )
            .addClass( feedback.horizontal )
            .appendTo( this );
        }
    }
});

タイトルのあるアイテムにカーソルを合わせると、ツールチップが表示されるようになりました。ここまでは順調ですね。

問題は、かなり動的なコンテンツがあるため、ツールチップが表示されている間に要素が別の要素に置き換えられることがあります。これは、ツールチップがフェードしないという問題につながります。

私はこのフィドルでこの問題を再現しました:

http://jsfiddle.net/aE8qn/ ...最初の項目をクリックするだけです (マウスをその上に置いたままにしてください)。アイテムが削除されたら、マウスを離してその上に戻します。古いツールチップがそのまま残り、現在のツールチップが表示されたときにオーバーレイされることに気付くでしょう。

回避策はありますか？

4

2 に答える 2

2

古いコンテンツが削除されている間に、古いツールチップをクリアできます。

$("#items").children().each(function(){
    this.onclick = function(){
        console.debug("test");
        this.remove();
        $(".ui-tooltip").remove();
    }
});
于 2013-10-29T11:37:13.017 に答える
0

誰かがまだ解決策を探している場合に備えて：

$( document ).tooltip({
    position: {
        my: "center top+20",
        at: "center bottom",
        using: function( position, feedback ) {
            /* fix tooltip not hiding problem */
            if($( ".ui-tooltip" ).length>1){
                // since the new tooltip is already added, there are now 2. 
                // removing the first one fixes the problem
                $( ".ui-tooltip" )[0].remove();
            }
            $( this ).css( position );
            $( "<div>" )
            .addClass( "arrow" )
            .addClass( feedback.vertical )
            .addClass( feedback.horizontal )
            .appendTo( this );
        }
    }
});

フィドル: http://jsfiddle.net/aE8qn/1/

于 2015-09-28T15:22:46.770 に答える