Hi,
I have problem with displaying images when the text is hovering, problem is only in Opera.
At the site I have a table (#ktoJestKim) within some people (first and last name, sometimes an image). An image sholud be displayed when you hover somebody’s name.
See the site: http://www.antoni.org.pl/index.php?option=com_content&view=article&id=186
HTML-code:
Code:
…
Jon Doe
…
CSS:
Code:
#ktoJestKim span {
position: relative;
}
#ktoJestKim span:hover {
background: #ffffcc;
}
#ktoJestKim span img {
position: absolute;
z-index: 10;
top: -26px;
left: 150px;
display: none;
width: 150px;
background: #ddd;
padding: 0.5em;
border: 1px solid #333;
}
JavaScript code (for hovering):
Code:
$(‘#ktoJestKim span’).each(function(){
$(this).children(‘img’).hide();
$(this).hover(function(){
$(this).children(‘img’).show();
},function(){
$(this).children(‘img’).hide();
});
});
And problem shows when you scroll down then image shows in wrong place (too high). Each image should be displayed 26px upper than parent span. I assume this is Opera bug but have you any idea to fix this?