[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » Форум » Скрипты для uCoz » Горизонтальное меню
Горизонтальное меню
orlenokДата: Пятница, 18.03.2011, 13:13 | Сообщение # 1
Admin
Группа: Администраторы
Сообщений: 532
Статус: Offline

ПОСМОТРЕТЬ

1. Качаем архив.

2. С помощью Файлового менеджера создаём папку js и заливаем в неё файл jquery

3. Затем создаём папку img и заливаем в неё файл a_bg (если будете использовать
вариант меню с картинкой).

4. Открываем Панель управления --> Страницы сайта и перед тегом </head> вставляемэто:

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


5. Далее, на этой же странице, перед тегом </body вставляем этот скрипт:

Code
<script type="text/javascript">

          $(document).ready(function() {

$("#topnav li").prepend("<span></span>");   

$("#topnav li").each(function() {   

var linkText = $(this).find("a").html();   

$(this).find("span").show().html(linkText);   

});   

$("#topnav li").hover(function() {   

$(this).find("span").stop().animate({   

marginTop: "-40"   

}, 250);

} , function() {   

$(this).find("span").stop().animate({

marginTop: "0"   

}, 250);

});

});

</script>


6. Затем открываем Таблицу стилей (CSS) и в самый низ вставляем это:

Code
ul#topnav {

margin: 10px 0 20px;   

padding: 0;   

list-style: none;   

font-size: 1.1em;

clear: both;

float: left;

width: 100%;

}

ul#topnav li{

margin: 0;   

padding: 0;   

overflow: hidden;   

float: left;   

height:40px;

}

ul#topnav a, ul#topnav span {

padding: 10px 20px;   

float: left;   

text-decoration: none;   

color: #fcce61;

text-transform: uppercase;

clear: both;

height: 20px;

line-height: 20px;

background: #000000;   

}

ul#topnav a {    color: #7bc441; }

ul#topnav span {

display: none;

}

ul#topnav.v2 span{

background: url(/img/a_bg.gif) repeat-x left top;

}

ul#topnav.v2 a{

color: #555;

background: url(/img/a_bg.gif) repeat-x left bottom;

}


7. Затем вставляем на страницу сайта, там где будет ваше меню, один из этих вариантов кода:

Вариант меню без картинки:

Code
<ul id="topnav">
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
</ul>


Вариант меню с картинкой:

Code
<ul id="topnav" class="v2">
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
<li><a href="ССЫЛКА НА СТРАНИЦУ САЙТА">ТЕКСТ</a></li>
</ul>
 
minin15Дата: Суббота, 02.07.2011, 20:45 | Сообщение # 2
Группа: Пользователи
Сообщений: 2
Статус: Offline

Перезалей !!!!!! Я скачаю
 
orlenokДата: Воскресенье, 03.07.2011, 18:01 | Сообщение # 3
Admin
Группа: Администраторы
Сообщений: 532
Статус: Offline

Перезалил
 
minin15Дата: Воскресенье, 03.07.2011, 18:36 | Сообщение # 4
Группа: Пользователи
Сообщений: 2
Статус: Offline

Спасибо !!!!!!!
 
Форум » Форум » Скрипты для uCoz » Горизонтальное меню
Страница 1 из 11
Поиск:

Скачать Adobe Photoshop

Как установить Adobe Photoshop

Adobe Photoshop Portable

Adobe Flash Professional

Orlenok Design Studio ® 2008 - 2017