2012-03-29 3 views
0

Я довольно много искал, но не смог найти именно то, что искал. Я пытаюсь добиться эффекта от того, где, когда щелкнут элемент «Родительский», будет сброшен и отображен div, содержащий подменю со ссылками относительно этого родительского элемента. Я создал пример здесь, чтобы дать представление:On Click Toggles Подменю

http://jsfiddle.net/itsbc/WeL6j/1/

Однако, я не хочу, серый DIV - # 9e9e9e «#div» - должны быть охвачены. Я понимаю, что причина в том, что я установил позицию содержимого в фиксированную, однако, если я снимаю атрибут position, подменю отображаются ниже их соответствующего родителя; против того, чтобы быть расположенным до упора влево.

Заранее благодарим за помощь, Bc.

ответ

1

ли http://jsfiddle.net/WeL6j/7/ то, что вы хотите сделать? Если это так, я думаю, что проще всего поместить скрытые div под панелью навигации, где они должны отображаться. Затем просто скройте/отобразите как необходимо

+0

Отлично. Огромное спасибо. Мне просто нужна базовая версия для адаптации к дизайну, который я имею в виду. – itsbc

+0

Итак, еще один вопрос относительно этого. Он отлично работает в jsfiddle (http://jsfiddle.net/itsbc/WeL6j/10/), однако, когда я пытаюсь загрузить его в свой код шаблонов, который является очень простым на данный момент, поскольку я только начинаю его - он не откроет скрытый div. Я заметил в скрипке, что, когда я меняю панель javascript на Javascript 1.7, он больше не будет раскрываться. Мне интересно, использует ли мой шаблон, и если да, то как мне сделать версию скрипта совместимой с ней? Спасибо заранее, Брайан. – itsbc

2

Вы можете попробовать тумблер, метод JQuery: http://api.jquery.com/toggle/

+0

Я очень новичок в jquery, но я думаю, что правильно использовал функцию переключения в приведенной выше скрипке. Майкл, ниже, предоставил мне ответ, который я искал, но спасибо за ответ и помощь. Как только моя репутация будет достаточно высокой, я обязательно вернусь и ответю. – itsbc

2

Похоже, вы ищете функциональность подобной вкладок JQuery. Проверьте разборный вариант: http://jqueryui.com/demos/tabs/#collapsible

Вы должны продлить его немного, так что содержание скользит вниз вместо того чтобы показывать вверх: пример:

http://jsfiddle.net/s6m7E/4/

+0

В любом случае вы можете применить его к скрипке, которую я разместил выше? Мои знания о jquery очень новички, и я нашел ту, которая работает так, как мне нравится, за исключением того, что она сложена вертикально (например, ваша). Я надеюсь получить его в горизонтальном формате, чтобы я мог использовать его для меню навигации. Спасибо за помощь. – itsbc

+0

Еще раз спасибо за помощь. Майкл, выше, добился именно того, ради чего я собирался. Как только я получу репутацию 15+, я обязательно вернусь и ответю на помощь. – itsbc