开发者

How to create scrollbar in jQuery UI tab?

开发者 https://www.devze.com 2023-04-05 20:10 出处:网络
I am using jQuery UI to create 2 tabs. I really only need the first tab (lab开发者_如何学JAVAeled \"Queue\") to be scrollable, but if all tabs created are vertically scrollable that\'s fine too.

I am using jQuery UI to create 2 tabs. I really only need the first tab (lab开发者_如何学JAVAeled "Queue") to be scrollable, but if all tabs created are vertically scrollable that's fine too.

Note that I do not want or need a horizontal scroll bar.

I've tried placing overflow: auto; in various locations in my CSS but I can't seem to find the results I want. My code is on jsFiddle here: http://jsfiddle.net/6Ctnt/

Can anyone help me figure out what I'm doing wrong?

Update

I need the list of items (inside of #list-container) to be scrollable. This whole thing needs to be dynamic, so I can't use any fixed sizes for height. I need the tab content area to consume the remaining space that isn't occupied by the #button-container and the container where the list of tabs is stored.


Adding this CSS may do the work:

#list-container {
    height: 200px;
    overflow-y: scroll;
}

Edit: Without fixed heights:

#queue-tab {
    position: relative;
    height: 100%;
}
#list-container {
    position: absolute;
    top: 0; bottom: 0;
    right: 0; left: 0;
    overflow-y: scroll;
}

Still need to fix margins... but it seems to work

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号