Создание меню с помощью jQuery для Ucoz от o-ucozik.ru | Скрипты для ucoz от o-ucozik.ru
 

 

     
http://o-ucozik.ru/Sait/logo.png  
 
 

 Главная Форум Все для ucoz Топ сайтов Проекты Получить сертификат Карта сайта Rss  Реклама 

Наш опрос
Как вам диз?
Всего ответов: 259
Мини-чат
200
http://s18.ucoz.net/img/icon/tr.png Реклама 468*60 [Купить]
[Главная] [Форум] [Работа] [V.I.P] [Карта сайта] [Реклама на портале] [RSS]

В связи с тем, что сайт был взломан и переведен на новый домен, просьба сообщать нам о нерабочих файлах!


Создание меню с помощью jQuery для Ucoz



Новая страница 1





Описание:

 

Данное меню интересно несколькими характеристиками:

1) Оно занимает очень мало места в неактивном состоянии. После наведения на
него мышкой выбраный элемент увеличивает свой размер.

2) Иконки элементов меню при наведении меняются.

3) Кликабельным является не только текст ссылки, но полностью весь блок.


Установка:

1) Ставим этот код после <body> на той странице где вы хотите видеть это
меню:





Code



"dblueCol"><ul id="invComm">"iconbar">

"dblueCol"><li>"dblueCol">"greenCol"><a href="invComm">"#">

"dblueCol">"purpleCol"><img src="invComm">"menu/key.gif" alt="invComm">""
/>



"dblueCol"><span>Change your password"dblueCol"></span>

"dblueCol">"greenCol"></a>"dblueCol"></li>

"dblueCol"><li>"dblueCol">"greenCol"><a href="invComm">"#"
target="invComm">"_blank">

"dblueCol">"purpleCol"><img src="invComm">"menu/rss.gif" alt="invComm">""
/>

"dblueCol"><span>Suscribe to our RSS!"dblueCol"></span>

"dblueCol">"greenCol"></a>"dblueCol"></li>

"dblueCol"><li>"dblueCol">"greenCol"><a href="invComm">"#">

"dblueCol">"purpleCol"><img src="invComm">"menu/sel.gif" alt="invComm">""
/>

"dblueCol"><span>Choose your options!"dblueCol"></span>

"dblueCol">"greenCol"></a>"dblueCol"></li>

"dblueCol"></ul>

2) Теперь ставим этот код в CSS. В
этом коде нужно будет изменить месторасположение данного
меню (я выделил эти мета):


  body { background: #ffffff; font: 11px

"Trebuchet MS", Verdana, Arial, sans-serif; }

p { padding-bottom:10px; position:absolute;

left:47%; bottom:5px; }

p a { text-decoration: none; outline: none;

color:#d00000; }

p a:hover { border-bottom: 2px dotted #d00000; }

#iconbar { position:absolute; top:45%; left:45%;

 text-shadow:0 1px 0 #eee;}

#iconbar li {

float:left;

position:relative;

margin-right:20px;

background:#e8e8f9;

border: 1px dashed #ffc0ff;

overflow:hidden;

}

#iconbar a {

text-decoration: none;

outline: none;

color:#d00000;

display: block;

width: 24px;

padding: 10px;

cursor:pointer;

}

#iconbar span {

width: 100px;

height: 35px;

position: absolute;

display: none;

line-height:110%;

color:#409BED;

padding-left: 10px;

} /*Copyright © 2007, Yahoo! Inc. All rights reserved.

Code licensed under the BSD License:

http://developer.yahoo.net/yui/license.txt

version: 2.2.2*/



body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,

fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:

0;}table{border-collapse:collapse;border-spacing:0;}fieldset,

img{border:0;}address,caption,cite,code,dfn,em,strong,th,var

{font-style:normal;font-weight:normal;}ol,ul

{list-style:none;}caption,th

{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight

:normal;}q:before,q:after{content:'';}abbr,acronym

{border:0;}

3) Теперь на тех страницах где у
Вас будет меню между <head> и </head> ставим этот код:


"dblueCol">"jsTag"><script type="invComm">"text/javascript"
src="invComm">

"menu/jquery.js">"jsContainer">"jsCode">"jsContainer">"jsCode">"htmContainer

">"dblueCol">"jsTag">"htmContainer"></script>

"dblueCol">"jsTag"><script type="invComm">"text/javascript"
src="invComm">"

menu/general.js">"jsContainer">"jsCode">"jsContainer">"jsCode">"htmContainer

">"dblueCol">"jsTag">"htmContainer"></script>








 



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

Жаловаться на материал Источник материала Добавить в закладки

Создание меню с помощью jQuery для Ucoz от O-Ucozik.ru

Кто добавил: [Kxaker] | Просмотров: [480] | Дата: [20.10.2009]


http://s18.ucoz.net/.s/img/icon/fr.png Отзывы о материале
Всего комментариев: 1
1  
супер





Мини профиль
Логин:
Пароль:
Выделенный сервер, аренда серверов, дешевые сервера, купить сервер, хостинг сервера
Поиск
Статистика
Онлайн всего: 2
Гостей: 2
Пользователей: 0


Кто онлайн:

Кто был:
Georgenah, ThomasMed, ScottBashy
Наши партнеры