Горизонтальное меню (с вкладками) с возможностью упаковки переполненных элементов в раскрывающийся список

Question

Это о html / css / javascript меню;)

Я ищу унифицированное решение, чтобы скрыть дополнительные вкладки горизонтального меню / меню с вкладками, когда оно переполняет его контейнер.

Первоначальная идея, плагиатируемая из рабочего процесса вкладок Firefox, т. Е. Если у вас слишком много вкладок, они добавят дополнительные вкладки в раскрывающуюся кнопку «Список всех вкладок».

Я думаю поиграть с переполнением: auto в сочетании с javascript, но есть ли что-то подобное, уже реализованное, или, может быть, есть идея получше?

Спасибо.

Answer 1

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

: авто может быть трудно, если не невозможно, точно контролировать с помощью JavaScript. Здесь вы, вероятно, должны следить за двумя вещами: родительский контейнер и UL, который содержит вкладки (предположительно, ссылки внутри LI). Вы можете сделать количественные сравнения между шириной обоих элементов в JavaScript довольно надежно.

Я не уверен, какую библиотеку вы предпочитаете использовать, но в YUI есть действительно мощная утилита - Region. Он возвращает объект, полный полезных свойств элемента - его положение в документе, размер и пересечение с другими элементами (см. http://www.wait -till-i.com / 2007/08/28 / мониторинг-элемент размерно-положение-с-Yui / * * 1005).

Независимо от того, какую библиотеку вы используете (или вообще не используете), концепции Region должны помочь вам двигаться в правильном направлении.