VPF::Не получается вставить код js в HTML с сохранением

opasyura

Дата 23.3.2012, 14:31 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 9
Регистрация: 5.7.2006

Репутация: нет
Всего: нет

Добрый день. Нужно готовый код меню на JS вставить в HTML рядом с другим меню, но чтобы при этом стиль меню на JS был такой же как и в остальном меню. Само меню на JS работает и находится в нужном месте, но не могу подобрать стили так, чтобы не испортить функционал явы скрипта.
Изначальный HTML код меню на JS

Код


<div id="main">
<ul id="slide_menu">
<li>
<h3>menu 1</h3>
<ul class="container">
<li><a href="#submenu11">submenu 1.1</a></li>
<li><a href="#submenu12">submenu 1.2</a></li>
<li><a href="#submenu13">submenu 1.3</a></li>
</ul>
</li>
</ul>
</div>

Код JS

Код


                window.addEvent('domready', function() {
                    var list = $$('#slide_menu li ul.container');
                    var headings = $$('#slide_menu li h3');
                    var collapsibles = new Array();
     
                    headings.each( function(heading, i) {
                        var collapsible = new Fx.Slide(list[i], {
                            //duration: 'normal',
                            transition: Fx.Transitions.quadOut
                        });
                        collapsibles[i] = collapsible;
                        heading.onclick = function(){
                            for(var j = 0; j < collapsibles.length; j++)
                                if(j!=i)
                                    collapsibles[j].slideOut();
                            collapsible.toggle();
                            return false;
                        }
                        collapsible.hide();
                    });     
                });

Кусок HTML где должно стоять меню верхнее меню - это меню которое должно работать на JS , нижнее обычное меню.

Код


    <div class="menu-list">
             <div class="title">Buy</div>
             
                <ul id="slide_menu">
                    <li>
                        <h3>menu 1</h3>
                        <ul class="container">
                            <li><a href="#submenu11">submenu 1.1</a></li>
                            <li><a href="#submenu12">submenu 1.2</a></li>
                            <li><a href="#submenu13">submenu 1.3</a></li>
                        </ul>
                    </li>
                    
                </ul>
           </div>
         
    <div class="menu-list">  
                <div class="title">Buy</div>
                <ul>
                    <li class="oppened"><a href="http://www.google.com">Sleep Number Beds</a>
                        <ul class="second">
                            <li><a href="http://www.google.com">Class Series</a></li>
                            <li><a href="http://www.google.com">Perfomance Series</a></li>
                            <li><a href="http://www.google.com">Innovation Series</a></li>
                        </ul>
                    </li>
                    <li><a href="http://www.google.com">Sleep Number Beds</a></li>
                    <li><a href="http://www.google.com">Sleep Number Beds</a></li>
                    <li><a href="http://www.google.com">Sleep Number Beds</a></li>
                    <li><a href="http://www.google.com">Sleep Number Beds</a></li>
                </ul>
            </div>

Помогите настроить стили под дизайн общего меню

Это сообщение отредактировал(а) Aliance - 3.4.2012, 17:45

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »