私はqTipにかなり慣れていませんが、これまでのところ、実装するのは素晴らしいようです.
連絡先にマウスオーバーすると、gmail のように連絡先にマウスオーバーを設定して、写真と特定のアクションを表示するように設定しようとしています。
現在、位置ターゲットをマウスに設定してコードを動的にロードし、非表示をfixed:trueに設定しています。
しかし、マウスを動かすとツールチップも移動するので、ツールチップ内のアクションをクリックできるように動かないようにする必要があります。
これは私がこれまでに持っているものです。
$(document).ready(function(){
// Use the each() method to gain access to each of the elements attributes
$('.contact').each(function()
{
$(this).qtip(
{
content: {
method: 'GET',
url: 'testData.php',
data: {
id: 1
}
},
position: { target: 'mouse',
adjust: { screen: true, scroll: true } },
show: {
delay: 700,
solo: true
},
hide: {
fixed: true, // Make it fixed so it can be hovered over
when: 'mouseout'
},
style: {
padding: '5px 15px', // Give it some extra padding
name: 'light' // And style it with the preset dark theme
}
});
});
});
どんな助けでも大歓迎です!!