1

Тема: JavaScript: Выпадающее меню с градиентом

На форуме была похожая тема, но это не то что мне нужно. Вот есть сайт http://nz-ua.com/, нужно сделать динамическое меню, которое при нажатии на Услуги сворачивалась бы и разворачивалось. в меню на фоне используется градиен, внизу тень и в этом вся проблема. подскажите, как можно добиться этого эффекта.

2 (изменено: Mikki, 2010-10-06 17:00:34)

Re: JavaScript: Выпадающее меню с градиентом

off:
Я не модератор, но уверен на 100%, что они пошлют вас читать правила форума на предмет требований к оформлению постов и топиков.

off2:
..если вы конечно не бот

Жизнь стоит того чтобы не быть сволочью. (с) Разные Люди

3

Re: JavaScript: Выпадающее меню с градиентом

я не бот

4 (изменено: JSman, 2010-10-09 01:22:24)

Re: JavaScript: Выпадающее меню с градиентом

Можно не играть со стилями CSS и объектной моделью HTML DOM, а воспользоваться  http://mootools.net/

5

Re: JavaScript: Выпадающее меню с градиентом

Меню можно сделать как полностью на JavaScript, так и средствами только CSS (с небольшими инъекциями кода для МСИЕ). Более правильно все же сделать с помощью стилевых правил. Градиент и тени тоже реализуемы и так и так.

Прошу прощения за отсутствие конкретики в словах, однако пытались ли Вы решать сами, искать решения в поиске?

( 2 * b ) || ! ( 2 * b )

6

Re: JavaScript: Выпадающее меню с градиентом

меню уже работает, но при нажатии на стрелку оно раскрывается, а при переходе на новую страницу, опять закрывается. Как зафиксировать положение меню или как сделать, чтобы оно по умолчанию было открыто, а не закрыто?
вот скрипт в html-странице:

<script type="text/javascript">
    $(document).ready(function() {
        $(".topMenuAction").click( function() {
            if ($("#openCloseIdentifier").is(":hidden")) {
                $("#slider").animate({ 
                    marginTop: "-248px"
                    }, 500 );
                $("#topMenuImage").html('<img src="design/images/open.png" alt="" />');
                $("#openCloseIdentifier").show();
            } else {
                $("#slider").animate({ 
                    marginTop: "0px"
                    }, 500 );
                $("#topMenuImage").html('<img src="design/images/close.png" alt="" />');
                $("#openCloseIdentifier").hide();
            }
        });  
    });
</script>

Вот css код меню:

#sliderWrap {
width: 242px;
}
#slider {
position: absolute;
background-image:url(linkList2.png);
background-repeat:no-repeat;
background-position: bottom;
width: 242px;
height: 279px;
margin-top: -249px;
}
#slider img {
border: 0;
}
#sliderContent {
position: absolute;
text-align:left;
}
#openCloseWrap {
position:absolute;
margin: 248px 0 0 0px;
font-size:12px;
font-weight:bold;
}

Вот ссылка на сам скрипт: http://nz-ua.com/design/scripts/jquery-1.2.6.min.js
Правда там код не красиво оформлен

7

Re: JavaScript: Выпадающее меню с градиентом

в css в margin-top изменил значение с -249px на 0px и теперь оно по умолчанию развернутое, но как сделать, чтобы вначале меню сворачивалось с первого раза кликая на стрелку, а не со второго, как сейчас. Потом оно сворачивается и разворачивается с первого раза.

8

Re: JavaScript: Выпадающее меню с градиентом

как в js прописать сохранение в куках? хочу, сделать так, чтобы браузер запоминал положение меню и не сворачивал его при переходе по страницам

9

Re: JavaScript: Выпадающее меню с градиентом

что, ни кто не знает?

10

Re: JavaScript: Выпадающее меню с градиентом

что, ни кто не знает?

Будьте терпимее - это не платная техподдержка. Почитайте документацию, погуглите - 95%, что Ваша проблема уже описана и решена.

Либо здесь нет специалистов по jQuery, либо они не читали Ваше сообщение. Исходный, несжатый код библиотеки читают иногда, но редко, а Вы предлагаете ее упакованную версию. Да и смысла в ней нет - все должно быть в документации.

как в js прописать сохранение в куках? хочу, сделать так, чтобы браузер запоминал положение меню и не сворачивал его при переходе по страницам

Запоминайте в куках какое-либо значение, а при каждом открытии проверяйте его - если есть и установлено, значит меню развернуто. Вообще-то это другой вопрос - логичнее создать создать новую тему.

( 2 * b ) || ! ( 2 * b )

11

Re: JavaScript: Выпадающее меню с градиентом

Rumata пишет:

Вообще-то это другой вопрос - логичнее создать создать новую тему.

так и сделаю