Актуализация: Оставих следния javascript код, за да покажа как се е развил проблемът с времето, но сега се оказа, че това НЕ е уместно, тъй като javascript не е проблемът. Моля, погледнете html/css кода по-долу.
За страница с общ преглед с голямо меню внедрих следната функция (повечето от които откраднах от тук):
function isScrolledIntoView(elem)
{
var docViewTop = $(window).scrollTop();
var docViewBottom = docViewTop + $(window).height();
var elemTop = $(elem).offset().top;
var elemBottom = elemTop + $(elem).height();
alert(elemBottom);
return ((elemBottom >= docViewTop) && (elemTop <= docViewBottom));
}
$(document).ready(function(){
var overview = $('#overview');
var active = $('#active-item');
if (!isScrolledIntoView(active))
{
$('#overview li.active-parent').each(function(index, value){
if (!isScrolledIntoView(active)) overview.scrollTo(value);
});
}
if (!isScrolledIntoView(active)) overview.scrollTo(active);
});
Идеята е, че след всяко зареждане на страницата, съдържащото менюто се превърта до позиция, където се вижда текущият #active-item. За предпочитане чрез превъртане до неговия първи родител (елементите от менюто са в дърво), в противен случай до самия елемент.
Сега това работи добре във Firefox и Chrome (и никой от хората на Apple не ми се е оплакал), но Opera прави наистина странно нещо: тя превърта надолу до правилния елемент, след това спира за много кратко, преди да превърти докрай отново
Някой има ли представа
- Какво се случва и
- Как мога да го спра?
Благодаря,
Актуализация: Тествам с версия 10.63 на linux (Fedora)
Актуализация: изглежда, че съм търсил в грешната посока. Изглежда, че проблемът е в css и може да бъде възпроизведен със следния код:
<html>
<head>
<title>Opera scroll test</title>
<style>
.main:after
{
content: 'abc';
}
:focus
{
padding: 0px;
}
#overview
{
display: block;
float: left;
width: 219px;
height: 500px;
overflow: auto;
}
</style>
</head>
<body>
<div id="main" class="main">
<div id="overview">
<ul>
<?
for($i = 1; $i < 100; $i++)
echo '<li>'.$i.'</li>';
?>
</ul>
</div>
<div>
<p>123</p>
</div>
</div>
</body>
</html>
Сега, ако превъртите надолу в навигационния панел и преместите мишката си надясно (над панела със съдържание), превъртането на навигационния панел се нулира.
Съжалявам, че губя времето на всички с търсене на javascript :(
Ако има някакви css гурута, които знаят как да го поправят, или които могат просто да обяснят какво се случва, ще съм много благодарен.
Актуализация: тествах горния код в windows на opera 10.63. Появява се същото странно поведение.
Актуализация: докладвахме това на Opera като грешка. Чудя се какво ще стане...