Переполнение меню
 

Здравствуйте уважаемые ГУРУ javascript; у меня стоит задача реализовать переполнение меню, т.е. идея в том, что бы при добавлении нового элемента в !горизонтальное! меню с навигацией, если НовыйТолькоЧтоДобавленный Элемент переносится на другую строчку, т.е. все элементы меню имеют ширину больше чем область ширины самого меню (к примеру 1000;) тогда для тех элементов кот. не влазят, создается отдельная кнопочка(при наведении на эту кнопочку, ну или при нажатии(не имеет значения) все те элементы кот. не влезли выстраиваются в список вертикально).

как я понял нужно изначально получить высоту родительского элемента.

<div id="menu">
<ul>
<li><a href="#">Главная</a></li>
<li><a href="#">О нас</a></li>
<li><a href="#">Разное</a></li>
<li><a href="#">Товары</a></li>
<li><a href="#">Samsung</a></li>
<li><a href="#">Nokia</a></li>
<li><a href="#">Tefal</a></li>
<li><a href="#">Asus</a></li>
<li><a href="#">Еще ссылка</a></li>
<li><a href="#">ссылка кот. не влазит</a></li>
</ul>
</div>

т.е.

window.onload = function ()
{
var menu = document.getElementById('menu');
var originalWidth = menu.clientWidth;
}
После чего, я так думаю, нужно сделать проверочку то то вроде:

if originalWidth < И тут вопрос

Как получить тот элемент кот. не влез?
Помогите пож-та, Спасибо огромное!

даже не так, как получить ширину всех блоков {li a} а потом уже проверочку, для тех элементов кот не влезли...

var items = menu.children;
далее проходишь циклом и проверяешь свойство items[i].offsetWidth если не влазит - останавливаешь цикл и предпринимаешь меры.

Спасибо :)

window.onload = function ()
{
var menu = document.getElementById('menu');
var items = menu.childNodes[1].children;
var orWidth = menu.offsetWidth;
var sun=0;
for (var i=0; i<items.length; i++)
{
var sum = items[i].offsetWidth;
sun+=sum;
if (sun > orWidth)
{
var newMenu = document.createElement('DIV');
items.insertBefore(newMenu, items[i])
}
}
}

все, спасибо я понял что делать :)

вот рабочий код, если кому поможет

window.onload = function ()
{
var menu = document.getElementById('menu');
var items = menu.childNodes[1].children;
var orWidth = menu.offsetWidth;
var sun=0;
var arr = new Array();
for (var i=0; i<items.length; i++)
{
var sum = items[i].offsetWidth;
sun+=sum;
if (orWidth < sun)
{
var count = i;
break;
}
}
var sum = items.length - count;
var ul = document.getElementById('perepoln');
for (i=0; i <= count; i++)
{
ul.insertBefore(items[count], ul.children[i]);
}
}