Opera problem with displaying

[kobylecki]

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?

[Author]

Posts