マウスオーバー時にツールチップを表示し、マウスアウト時に非表示にしようとしています。
私が使用した:
var keepTab = false;
var sC = $('#SwitchContent')
$('#navbar img').mouseenter(function(){
sC.show("slow");
LoadPage($(this).attr('alt'));
keepTab = false;
sC.removeClass("selected");
}).mouseout(function(){
if (!keepTab){
sC.fadeOut("slow");
}
});
$('#navbar img').click(function(){
keepTab = true;
sC.addClass("selected");
});
そしてhtml
<div id="navbar" style="margin-top: <?= $navBar_margintop ?>px">
<img src="images/tab9.gif" alt="tab9" style="margin-right: <?= $margintab9 ?>px" height="<?= $navbarH[8] ?>" width="<?= $navbarW[8] ?>"/>
<div class="clear"></div>
<img src="images/tab1.gif" alt="tab1" style="margin-right: <?= $margintab1 ?>px" height="<?= $navbarH[0] ?>" width="<?= $navbarW[0] ?>"/>
<div class="clear"></div>
<img src="images/tab2.gif" alt="tab2" style="margin-right: <?= $margintab2 ?>px" height="<?= $navbarH[1] ?>" width="<?= $navbarW[1] ?>"/>
<div class="clear"></div>
....
<img src="images/tab8.gif" alt="tab8" style="margin-right: <?= $margintab8 ?>px" height="<?= $navbarH[7] ?>" width="<?= $navbarW[7] ?>"/>
ホバーもしてみました。しかし、両方とも、表示と非表示のアクションがループでスタックするというバグがありました (一部の時間のみ)。これはすべてのブラウザで発生します。
実際の例はここで見ることができ ます
ありがとう。
編集:
マウスエンターも試しました。