1

jQuery ツールチップ内でカスタム jQuery スクロールバーを使用しています。

Firefoxで 2 回クリックして開くと、たとえば開いた場合、閉じるのではなく、ツールチップをもう一度アクティブにします。

クロムでは、ブラウザウィンドウのサイズを変更したときにのみ表示され、正常に機能します。

これをフィドルで複製して表示しようとしましたが、フィドルは非動的コンテンツに対しては正常に機能します: http://jsfiddle.net/mstefanko/JdAmG/71/ フィドルは私が取り組んでいるものを表示します。

ツールチップの HTML は、実際には php インラインを使用しています。

<div class="grab-this">
<div id="tip-content" class="nano">
    <div class="scrollContent">
    <?php foreach ( $member_info as $member ) : ?>
        <div class="member">
            <div class="member-photo">
                <img class="photo" src="<?php echo $member->photo_url ?>"/></div>
            <div class="team-member-screen-name">                                       
            <a href="<?php echo $member->url ?>"><?php echo $member->screen_name ?></a>
        </div>
    </div>
    </div>
    <?php endforeach ?>
</div>
</div>

次を使用して、ツールチップのコンテンツを取得しています。

var team = $('.grab-this').html();

次のようにツールチップをアクティブにします。

$('.tooltip').tipTip({activation: 'click', content: team, enter: function(){
    $("#tip-content.nano", "#tiptip_content").nanoScroller();
});

Chrome では、ツールチップを開くたびに画像とリストが再作成されているように見えることに何よりも気づきました。それを修正する方法がわからない。

また、実際にこれをサポートするためにライブラリ内の enter コールバックを移動しましたが、以前はコンテンツがツールチップに読み込まれる前でした。

どんなアイデアでも大歓迎です。この時点で、ウィンドウのサイズ変更を偽装するハックや、コンテンツが 100% ロードされた後にスクロールバーを強制的にリセットする方法さえあれば、驚くべきことです。ありがとう

4

1 に答える 1

2

mCustomScrollbarプラグインにも同じ問題がありました。スクロールバーを適用していたコンテンツを含むdivの高さを動的に設定していたため、何も機能しないことがわかりました(ただし、ウィンドウのサイズを変更すると機能しました)。そこで、スタイル シートで div の高さを 1px に設定updateOnContentResizeし、次のようにプラグインの初期化時に trueに設定しました。

$( '.mCustomScrollbar' ).mCustomScrollbar ( { advanced: { updateOnContentResize: true } } );
于 2012-11-29T17:17:45.230 に答える