当前位置: 动力学知识库 > 问答 > 编程问答 >

css - how to keep element from scrolling into view?

问题描述:

I'm using jstree plugin altogether with filament group buttons on the web page.

I would like filament group buttons to scroll out of view (stay where they are) when user scroll down but instead buttons staying in view. And that happens only on IE.

Here is how it looks when there is no scrolling:

Before Scrolling http://i375.photobucket.com/albums/oo194/cyberkrul/temp/PositionWithScrollProblem1.png

Now when user starts to scroll...

When user starts scrolling ... http://i375.photobucket.com/albums/oo194/cyberkrul/temp/PositionWithScrollProblem2.png?t=1256234917

Can anybody suggest what might be the problem?

Here is html:

 <div id="divItems" style="overflow: auto; height: 100%;">

<div class="fg-toolbar ui-widget-header ui-corner-all ui-helper-clearfix">

<div id="divTreeToolbar" class="fg-buttonset ui-helper-clearfix">

<a id="btnRefreshTree" href="#" class="fg-button ui-state-default fg-button-icon-solo ui-corner-all" title="Refresh"><span

class="ui-icon ui-icon-refresh"></span>Refresh</a>

<a id="btnSortTreeFoldersAsc" href="#" class="fg-button ui-state-default fg-button-icon-solo ui-corner-all" title="Sort Folders Ascending">

<span class="ui-icon ui-icon-circle-arrow-s"></span>Sort Asc</a>

<a id="btnSortTreeFoldersDesc" href="#" class="fg-button ui-state-default fg-button-icon-solo ui-corner-all" title="Sort Folders Descending">

<span class="ui-icon ui-icon-circle-arrow-n"></span>Sort Desc</a>

<a id="btnSearchTree" href="#" class="fg-button ui-state-default fg-button-icon-left ui-corner-all" title="Search"><span

class="ui-icon ui-icon-search ui-icon-refresh"></span>Search</a>

</div>

</div>

</div>

网友答案:

It seems by the look of that scrollbar that you mean IE6.

If so, there is a bug in IE6 that causes anything with position:absolute; on an html page with height:100% to act as position:fixed instead.

Here is a writeup on it: http://www.cssplay.co.uk/layouts/fixed.html

网友答案:

That sounds like a problem with the positioning (duh :)). How do the code look like? Where are the buttons placed within the page? I think for it to be correct, the buttons should have position: absolute or position:relative, and their parent, which should be the div with the folders or some other div within that one (the one that is scrolling), also need to have position:relative so that the buttons know which div to follow.

Seeing that the background of the buttons follow the scrolling, first thing to try would be to set that one to position:relative.

I hope I made myself somewhat clear, in a bit of a hurry, but hopefully it will give you some idea of what to look for.

分享给朋友:
您可能感兴趣的文章:
随机阅读: