Вертикальное голубое меню для сайта uCoz - Скрипты для uCoz | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Воскресенье, 04.12.2016
Скрипты для uCoz » Вертикальное меню для сайта uCoz » Вертикальное голубое меню для сайта uCoz

Аудиоплеер для сайта uCozАудиоплеер с плейлистом для сайта
Видеоплеер для сайта uCozВидеоплеер с плейлистом для сайта
Меню для сайта uCozВертикальное меню для сайта uCoz
Выпадающее меню для сайта uCozГоризонтальное меню для сайта uCoz
Круглое меню для сайта uCozВид материалов для сайта uCoz
Вид материалов Аудио для uCozВид материалов Видео для uCoz
Галерея для сайта uCozГенераторы для сайта uCoz
Контейнер для контентаКнопки для сайта uCoz
Слайдер для сайта uCozСчётчик для сайта uCoz
Часы для сайта uCozТекстовые эффекты
Таблица цветов для сайта uCozЭффекты для сайта uCoz
Эффекты курсораЭффекты увеличения
Мини чат для сайта uCozРадио для сайта uCoz
Скрипты для юКозИгры для сайта uCoz
Окна для сайта uCozИнформеры для сайта uCoz
Флеш и анимации для сайтаКалендарь для сайта uCoz
Мониторинг серверов для ucozСлайдшоу для сайта uCoz



Адаптивный сайт - aTmpl



Вертикальное голубое меню для сайта uCoz

Меню для сайта uCoz без скриптов работающее на CSS



Меню лёгкое и не будет утежелять загрузку страниц Вашего сайта.Меню легко настроить под требуемые параметры,внеся корректировки в стиле.Его можно установить как дополнительное на странице,оно ни с чем не будет конфликтовать.Скопируйте исходный код в текстовый документ,назовите его как хотите,например menu.html,согласитесь на изменение расширения документа.Откройте Ваш файл menu.html,и внесите изменения в параметры стилей.Если Вам не понятна работа свойств CSS,введите название свойства в поиске сайта и прочитайте возможности настройки интересуюющего свойства.Скачайте исходник меню,распакуйте = будете иметь готовые файлы для редактирования.Если у Вас появились вопросы по поводу установки,задавайте их в комментарии.



<!DOCTYPE html>
<html lang="ru">
<head>
<title>Секционное меню Делай сайт</title>
<meta charset="utf-8">
<style type="text/css">
/* Позиционируемый блок */
.okno {
margin:0;
padding:0;
width:600px;
height:500px;
position:fixed;
}
/* Основной блок */
.dsmenublock {
background-color: transparent;
border: 5px double #217da0;
padding: 0 1em 10px;
width: 599px;
height:500px;
margin: 0 auto;
color:#000040;
}
/* Верхний заголовок */
.dsmenublock h2 {
margin: 5px 0;
color:#217da0;
}
/* Секционный блок */
.dsmenublock .section {
border-bottom: 2px solid #217da0;
padding: 0 1em;
background-color: transparent;
}
/* Здесь можно изменить цвет */
.dsmenublock h3 a {
display: block;
font-weight: normal;
padding: 5px 0;
color:#000040;
}
/* Здесь можно не менять */
.dsmenublock h3 a:hover {
text-decoration: none;
}
/* Здесь можно не менять */
.dsmenublock h3 + div {
height: 0;
overflow: hidden;
-webkit-transition: height 0.3s ease-in;
-moz-transition: height 0.3s ease-in;
-o-transition: height 0.3s ease-in;
-ms-transition: height 0.3s ease-in;
transition: height 0.3s ease-in;
}
/* Здесь можно изменить цвет */
.dsmenublock :target h3 a {
text-decoration: none;
font-weight: bold;
color:#000040;
}
.dsmenublock :target h3 + div {
height: 150px;
}
.dsmenublock .section.large:target h3 + div {
overflow: auto;
}
</style>
</head>
<body>
<div class="okno">
<div class="dsmenublock">
<h2>Меню секционное Делай сайт</h2>
<div id="one" class="section  large">
<h3>
<a href="#one">Описание меню</a>
</h3>
<div>
<p>Меню для использование в пределах страницы или с нестандартным дизайном.
Все размеры можно настроить по своему желанию.
Можно приспособить в блок сайта предварительно понизив размеры.
Меню на чистом CSS без использования скриптов.Скачав архив распакуйте его,файл HTML откройте блокнотом и отредактируйте на своё усмотрение.
Желаю удачи!<br><big><em>Меренков Михаил</em></big></p>
</div>
</div>
<div id="two" class="section large">
<h3>
<a href="#two">Тег <aside></a>
</h3>
<div>
<p>Тег <aside> служит для добавления на страницу дополнительного поля.
В дополнительном поле может содержатся что угодно.Для дополнительного поля нужно прописывать индивидуальные стили.
Тег поддерживает глобальные атрибуты в HTML5</p>
<br>
<iframe src="http://delaisait.ucoz.ru/html/demo/aside.html" height="250" width="99%"></iframe>
<br>
</div>
</div>
<div id="tree" class="section">
<h3>
<a href="#tree">Тег <a></a>
</h3>
<div>
<p>Тег <a> предназначен для ссылок.Поддерживает глобальные атрибуты,а так же атрибуты событий в HTML5.</p>
</div>
</div>
<div id="for" class="section">
<h3>
<a href="#for">Наконец</a>
</h3>
<div>
<p>Вы можете добавить секций до нужного количества.</p>
</div>
</div>
</div>
</div>
</body>
</html>

Меню в работе




Скачайте исходник меню


DownloadFree









Русские шрифты



Ссылка:
BB code:




  • ©
  • | Просмотров: 956 | Добавил: IZOTOP | Рейтинг: 0.0/0
    | Теги: меню на сайт, Меню для uCoz, Голубое, menu for site, меню для юкоз

    Вы будете первый кто оставит комментарий

    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]