JQuery Fixed Chat bar? -

hi, everyone!

i'm venturing new project, more specifically, fixed chat bar. chat bar expands 100% width of document, , of course fixed on bottom of page.

so here goes question. goal use jquery determine when no more tabs can placed, , alternative way of add tabs bar added (ex. maybe tabs, or simple scroll button iterates through each tab).

my problem, @ point in process, fact i'm not sure how "attack" plan. right now, chat bar made of parent div (ghchatbar), , it's children float left, tabs being in it's own div (to seperate easier access, holds div id "ghchattabs").

so break down, want find way determine when tabs have met end of division, whilst not affecting friends online button, yet still allow user open more tabs, have way add them bar, without going outside of bar, kind've how facebook's approach works. once open enough tabs, adds dropmenu consisting of tabs can't fit on screen. if makes easier, no other divs present right, tabs. feel smarter thing recode bar using unordered list approach, thoughts on well?

an example of how chatbar laid out: imageshack.us image

i appreciate answers in advance, , appreciate taking time out.

thanks!

edit

<div id="ghchatbar">     <div class="friends-online">         [11] friends online         <div class="friends-list">             <!-- friends list popup div goes here -->         </div>     </div>     <!-- chat window container -->     <div id="ghchattabs">        <div class="ghchatwindow" data-userid="userid" id="user-chat-{id_goes_here}">            <!-- inside of chat window -->        </div>     </div>     <!-- end chat container --> </div> 

obviously, parent div "ghchatbar" holds fixed position, 100% width, etc. above simple breakdown of html bar built in. inside of bar floats left. has set width.