jQuery UI Slider not working correctly in Opera?

So, I'm new to this, started learning web design in January, and still working on my first site, but I have encountered problems with the UI slider and Opera that I can't seem to figure out.

Whenever the UI handle is clicked, or more accurately pressed down, the main window "largewindow" jumps to "top:0" for some reason?

I have the following code:

<ul id="largewindow">
<li class="smallwindow">
    <ul class="first">
        <li class="logo"></li>
            <li class="scrollerwindow">
                <dl class="docwindow">
                    <dt class="somethingthumb1"><a href="/link/to/my/firstfile.html"></a></dt><dd>This is my first file</dd>
                    <dt class="somethingthumb2"><a href="/link/to/my/secondfile.html"></a></dt><dd>This is my second file</dd>
                </dl>
            </li>
        <li class="sliderbg"></li>
        <li id="slider1" class="slider"></li>

    </ul>
</li>

#largewindow {position: absolute; margin:0; padding:0; height: 6400px; width: 2250px; top:0; left:0; z-index:92}
#largewindow > li{position:relative; float:left; height:500px; width:2250px; list-style:none;}
.first {height:500px; width:750px; float: left;}
.logo {position: relative; height:60px; width:410px; top:27px; left: 160px; z-index:103;}
.docwindow {position: relative; height: 175px; width: 533px; top:-6px; left:0px; overflow: hidden;}
.scrollerwindow {position:relative; height: 175px; width:537px; top: 56px; left:92px; z-index: 99;}
.sliderbg {position:relative; top:54px; left: 80px; height:10px; width: 555px;}
.slider {left:78px; top:40px; widt开发者_C百科h: 506px; height: 10px; margin: 5px; position: relative; z-index:199;}
.ui-slider-handle {width: 40px; height: 8px; position: absolute; top: 1px; border: none; outline:none; z-index:199;}
.ui-slider-handle:hover {background: #someothercolor;}

i have tried cutting everything from the script to just this:

$("#slider1").slider();

And it still does it, cant for the life of me figure it out. If I set position of "largewindow" to fixed it solves the problem in Opera, but creates a bunch of new ones in all other browsers. I could probably get around the problem by using browser specific css rules, but since I can't find any information on this problem online I'm guessing it's just me being a newbie and missing something simple.

I've uploaded a real life example here: http://www.boatinfo.no/lib/library.html

?

I'm having the same problem. So far, I've tracked it down to the fact that clicking a slider handle gives the focus to the A element that is the handle, and this action causes Opera to scroll the element up. Now on to preventing this, eh!

--

So, I confirmed that giving focus to any old link in a scrollable area appears to trigger the link element's scrollIntoView(true) behaviour. Then I upgraded Opera to v11.10 and this bobo went away. And I thought I was soooo smart.