расположение подменю в меню jquery в сочетании с панелью инструментов stumbleupon происходит неправильно - PullRequest
Новая
       0

расположение подменю в меню jquery в сочетании с панелью инструментов stumbleupon происходит неправильно

0 голосов
/ 17 июля 2011

Название сценария: выпадающее меню

URL-адрес сценария: http://www.dynamicdrive.com/style/cs...rop_line_menu/

Меню работает нормально, однако я обнаружил, что, когда у меня есть спотыкание на панели инструментов, подменювнезапно размещается примерно на 22 пикселя ниже, чем должно быть.Иногда эта разница увеличивается в несколько раз.Вы можете сами проверить это поведение в браузере Chrome, включив панель инструментов stumbleupon и наведя курсор на один из пунктов меню, который имеет подменю: http://kwestievan.nl/unityexpress/

Как это исправить?Я проверил, была ли проблема body.offset (). Top, но на самом деле она выше разницы: 32px, а разница в меню - всего 22px.

1 Ответ

0 голосов
/ 18 июля 2011

Причина, по которой подменю ниже, из-за элемента 

<ul class="sub-menu"</ul>

присваивается стиль 

position: absolute;
left: 233px;
top: 224px;

Для этого нужно поместить подменю «ОТНОСИТЕЛЬНОЕ» в окно браузера так, чтобы оно находилось на 223 пикселя слева и на 224 пикселя в верхней части «окна браузера». Это прекрасно работает, когда нет панели инструментов "stumbleupon". Однако, когда вы добавляете панель инструментов stumbleupon, она добавляет панель инструментов в виде элемента iframe. Высота элемента iframe, из-за которого подменю сдвигается вниз, так как размеры окна браузера изменились.

Вы можете быстро проверить это, узнав высоту панели инструментов «stumbleupon» и сравнив эту высоту с величиной расстояния, которое подменю давило на разрешение монитора / экрана. Они будут такими же.

Решение состоит в том, чтобы дать элемент 

<li id="menu-item-1738"</li>

стиль 

position: relative;

и затем стилизовать подменю так, чтобы оно выровнялось и было «абсолютно» расположено «ОТНОСИТЕЛЬНО» к содержащемуся элементу li. Например 

position: absolute;
top: 20px;
left: 15px;

Конечно, все это делает ваш сценарий. Я не уверен, почему вы используете JavaScript для этого. Это может быть легко достигнуто одним только CSS.

...