質問

私は、クリックされたショーというツールチップ(Qティップ)の内側をライトボックス(nyroModal)の内側に隠さdiv要素の内容をリンクを配置しようとしています。成功したライトボックス内のdiv開口コンテンツへのツールチップのリンクでの正規アンカータグではない。

コード: http://jsbin.com/omafe/2/する

、メモ帳にコードをコピーし、HTMLとして保存し、ファイルを開くために必要がある場合があります。 (jsbinファイルプラグインの外部jsファイルをロードしない)

任意の助けいただければ幸いです。おかげます。

役に立ちましたか?

解決

Qティップは、メモリ(変数)に「div.tipcontent」のコピーを格納していることが表示されます。

私はDIVから「隠された」クラスを削除することによって、これを発見しました。これを行うと、あなたは2つのdivを持っていることがわかります。まだページの一つとメモリからのQティップが使用する別の。

ソリューションとして、あなたはそれがメモリからレンダリングリンクノードに$('a').nyroModal();を適用するQティップを変更する必要があります。

編集

次のようにQティップ初期化子を変更し、あなたのQティップリンクにライトボックスの効果を追加するには:

$('div.tooltip').qtip({
    content: $('div.tipcontent').html(),
    position: {
        corner: {
        target: 'topRight',
        tooltip: 'bottomRight'
        }
    },
    style: { 
        width: 150,
        padding: 10,
        background: 'silver',
        color: 'black',
        tip: 'bottomMiddle',
    },
    hide: {
        fixed: true
    },
    api: {
        onShow: function() { $('a').nyroModal(); }
    }
});

onShowへのAPI呼び出しに注意してください。これによりQティップから動的に生成されたコンテンツをカバーし、ページ上のすべてのリンクにnyroModalを再適用します。そこQティップによって生成された特定のリンクにjQueryのセレクタを絞り込むために、より効率的な方法は、おそらくですが、これは、あなたは、少なくとも始める必要があります。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top