[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Раздвижное меню "Accordion"
DuDe [ Offline ] Дата: Суббота, 21.11.2009, 00:07:39 | Сообщение # 1
Начинающий
Сообщений: 209
[ 144 ]
Награды: 6  

Скачиваем АРХИВ, распаковываем и заливаем папку "menu" в корень сайта.
В head ставим:

Code
<script language="javascript" type="text/javascript" src="/menu/jquery.js"></script>                       
<script language="javascript" type="text/javascript" src="/menu/accordion.js"></script>

В CSS вставляем:

Code
/* Menu */
.accordion h3 {
    font-size : 12px;
    color : #fff;
    padding-left : 10px;
    background : url(../menu/accordion.png) no-repeat right 0;
    line-height :25px;
    height : 25px;
    cursor : pointer;
    margin : 0;
    text-align : left;
    font-weight : bold;
    font-family: Arial, Helvetica, sans-serif;
}
.accordion h3:hover {
    color : #ffa;
    background-image: url(../menu/accordion.png);
    background-repeat: no-repeat;
    background-position: right -25px;
}
.accordion h3.active {
    background : url(../menu/accordion.png) no-repeat right -50px;
}
.accordion h3.active:hover {
    background : url(../menu/accordion.png) no-repeat right -75px;
}
.accordion p {
    display : none;
    margin : 0;
    padding : 7px 0 7px 7px;
}
.accordion a {
    font-size : 11px;
    color : #fff;
    text-align : left;
    font-weight : bold;
    padding-left : 15px;
}
.accordion p.linked a {
    background : url(../menu/bull.gif) no-repeat 0 50%;
}
.accordion p.linked a:hover {
    background : url(../menu/bulls.gif) no-repeat 0 50%;
}
/* ---------- */

Далее редактируете ссылки и ставите код:

Code
<div class="accordion">                       
                       <h3>Главное меню</h3>                       
                       <p class="linked">
                       <a href="/">Главная страница</a><br/>
                       <a href="/gb/">Гостевая книга</a><br/>
                       <a href="/index/0-3">Обратная связь</a><br/>
                       <a href="/board/">Доска объявлений</a><br/>
                       <a href="/publ/">Каталог статей</a><br/>                          
                       <a href="/dir/">Каталог сайтов</a><br/>
                       <a href="/blog/">Блог</a><br/>
                       <a href="/faq/"><font color="#ff8c00">FAQ (вопрос/ответ)</font></a><br/>
                        </p>                       
                       <h3>Компьютер</h3>                       
                       <p class="linked">
                       <a href="/load/">Каталог файлов</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       </p>                       
                       <h3>Отдохни</h3>                       
                       <p class="linked">
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       </p>                       
                       <h3>Форум</h3>                       
                       <p class="linked">
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       <a href="/">Пусто</a><br/>
                       </div>                       
                       <br />

В старой системе uCoz просто создайте глобальный блок, вставьте код и разместите ссылку на него в нужном вам месте - например создаем глобальный блок, называем его "MENU", ставим в него данный код, сохраняем и код блока $GLOBAL_MENU$ ставим в шаблон.

В новой системе -

Установка №1:

Помещаем код между:

Code
<!-- <sblock_menu> -->

                          сюда ставим код

<!-- </sblock_menu> -->

далее идем в быструю замену, режим замены многострочный,

в верхнее поле - если меню слева ставим $GLOBAL_CLEFTER$

если меню справа ставим $GLOBAL_DRIGHTER$, а в нижнее поле ставим:

меню слева

Code

<!-- <sblock_menu> -->

                          здесь код меню

<!-- </sblock_menu> -->
$GLOBAL_CLEFTER$

меню справа:

Code
<!-- <sblock_menu> -->

                          здесь код меню

<!-- </sblock_menu> -->
$GLOBAL_DRIGHTER$

жмем "заменить"

Если всё сделали правильно у вас появится новое меню.

Старое меню если не исчезло можно удалить через конструктор, просто удалив блок со старым меню!!!

Установка №2:

Включаем конструктор, создаём новый блок, далее жмём на значок шестерёнки в правом верхнем углу нового блока, далее идем на вкладку "HTML"
удаляем там всё и вставляем наш код. Сохраняем и пользуемся!!!

Ширина меню 188px, если надо пошире или поуже откройте картинку "accordion" в фотошопе, измените размер (только ширину) и сохраните. Формат картинки "PNG".



[qc][/qc]
 
Fr1mo [ Offline ] Дата: Суббота, 05.06.2010, 14:26:53 | Сообщение # 2
Начинающий
Сообщений: 17
[ 11 ]
Награды: 0  
не работает ...
 
  • Страница 1 из 1
  • 1
Поиск:
 
 
Последние темы Популярные темы Лучшие флудеры Новые пользователи

Конкурс "Угадай автомобиль"

(78)

Порно С Юной Девкой _952P

(2)

Скачать Трах Пэрис Хилтон _686O

(3)

Баги, ошибки на сайте

(21)

Сделано так как у вас.

(1)

FAQ по uCoz

(6)

Конверты на выписку весна лето от компании Baby Goldfinch

(0)

Здесь заказываем программы,ключи,keygen,patch

(5)

Ваш оператор

(6)

Какую трубу вы бы хотели?

(7)

Общение

(993)

GOLD-аккаунты к другим файлообменникам

(383)

GOLD-аккаунты к Letitbit.net

(233)

GOLD-аккаунты к Vip-file.com

(156)

Поиграем в смайлики

(115)

GOLD-аккаунты к другим файлообменникам

(93)

8-знак

(86)

Конкурс "Угадай автомобиль"

(78)

считаем до 100 и обратно

(77)

Раздача ICQ-номеров!

(61)

SToRm1k

(2948)

-==S_k_i_F==-

(632)

k1ngSD

(608)

mimonetut

(412)

SmaileS

(400)

Kojin

(387)

Rmk

(370)

adrefefex

(357)

}{0TT@БЬ)Ч

(341)

Aldo

(306)

ztaletaxuz

(06:59:26)

ctaletkrzs

(06:59:01)

gtaleteljd

(16:47:55)

staletmhfr

(12:49:05)

btaletkokj

(08:58:29)

ukvartirachink

(12:11:40)

etaletcxbm

(07:46:24)

leifwoolnug

(09:15:37)

ytaletiomo

(01:19:02)

Allainsor

(20:33:34)

Новых сегодня:2

 
 
Владельцы и создатели данного сайта не несут ответственность за использование и содержание ссылок и информации, представленных на этом сайте.
Переделка шаблона by SToRM.Сайт оптимизирован для просмотра с разрешением
1024x768, 1280x800, 1280x1024 и 1600x1200 браузером Opera.
PR-CY.ru