Hello guys on my blog I use this script:
jQuery(document).ready(function () {
jQuery(".postbox").hover(function () {
tipinfo = $(this).find('.tipinfo');
var t = jQuery(this).position() + jQuery(this).width();
var leftto = t.left + jQuery(this).width() - 30;
tipinfo.css({
top: jQuery(this).position().top + jQuery(this).height() - 2,
left: leftto
});
tipinfo.show(); //vedi tooltip
}, function () {
tipinfo.hide(); //nascondi tooltip
})
});
The tooltip works perfectly with all browsers except IE. I know that the state Hover the browser from Microsoft is not working, so I ask for your help. There is a hack to remedy the problem?
I would be very grateful for your help
The CSS:
.tipinfo {
border-radius: 3px 3px 3px 3px;
color: #FFFFFF;
display: none;
position: absolute;
width: 350px;
z-index: 1000;
}
.bgbull {
background: url(images/bgbulle.png) no-repeat scroll 0 0 transparent;
height: 29px;
line-height: 35px;
padding-left: 50px;
width: 308px;
}
.infob {
background: none repeat scroll 0 0 #151515;
border-bottom: 1px solid #151515;
border-left: 1px solid #151515;
border-right: 1px solid #151515;
line-height:1.2em;
padding: 5px
;width: 296px;
}
.bgbullbottom {
background: url(images/bgbullebottom.png) no-repeat scroll 0 0 transparent;
height: 29px;
line-height: 35px;
padding-left: 50px;
width: 308px;
}
HTML Code:
<div class="tipinfo" style="display:none;">
<div class="bgbull"></div>
<div class="infob">
<h4 style="color:#494949;font-family:arial,sans-serif;font-size:12px;font-weight:bold;"><?php the_title_attribute(); ?></h4>
<br>
<span style="color:#bbb;"><?php the_excerpt(); ?></span>
<br>
<div style="margin-top:2px;border-top:1px dotted #323232;"></div><br>
<div style="color:#bbb;">
<span class="info">Genere: </span><br />
<span class="info">Durata: </span><br />
<span class="info">Non sai se ti piace? </span>
</div>
<div class="clear"></div>
</div>
<div class="bgbullbottom"></div>
</div>
This like looks wrong to me:
var t = jQuery(this).position() + jQuery(this).width();
Because jQuery(this).position()
returns object, but jQuery(this).width()
returns integer. Probably you should change it to :
var t = jQuery(this).position();
t.left += jQuery(this).width();