[Web Master ]
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » Cкрипты для ucoz » Меню » Горизонтальное меню с иконками (Скрина к сожалению нет)
Горизонтальное меню с иконками
Alex28jДата: Воскресенье, 04.10.2009, 02:09 | Сообщение # 1
Генералиссимус
Группа: Администраторы
Сообщений: 286
Награды: 11
Репутация: 108
Статус:
Меню, над которым нужно потрудится, но оно того стоит

В CSS в любом для вас месте вставляем:

Code
*        
{        
margin: 0;        
padding: 0;        
}        
body        
{        
background: #fff;        
height: 100%;        
font-family: Arial, Helvetica, sans-serif;        
font-size: 12px;        
}        
.fisheye{        
text-align: center;        
height: 50px;        
position: relative;        
}        
a.fisheyeItem        
{        
text-align: center;        
color: #000;        
font-weight: bold;        
text-decoration: none;        
width: 40px;        
position: absolute;        
display: block;        
top: 0;        
}        
a.fisheyeItem2        
{        
text-align: center;        
color: #000;        
font-weight: bold;        
text-decoration: none;        
width: 40px;        
position: absolute;        
display: block;        
bottom: 0;        
}        
.fisheyeItem img        
{        
border: none;        
margin: 0 auto 5px auto;        
width: 100%;        
}        
.fisheyeItem2 img        
{        
border: none;        
margin: 5px auto 0 auto;        
width: 100%;        
}        
.fisheyeItem span,        
.fisheyeItem2 span        
{        
display: none;        
positon: absolute;        
}        
.fisheyeContainter        
{        
background-color: #fff;        
height: 50px;        
width: 200px;        
left: 500px;        
position: absolute;        
}        
#fisheye2        
{        
position: absolute;        
width: 100%;        
bottom: 0px;        
}

Далее вставляем код в том месте, где должно быть меню: (в основном под верхней шапкой или в самой шапке)

Code

<div id="fisheye" class="fisheye">        
<div class="fisheyeContainter">        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 1" width="30" /><span>Название ссылки 1</span></a>        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 2" width="30" /><span>Название ссылки 2</span></a>        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 3" width="30" /><span>Название ссылки 3</span></a>        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 4" width="30" /><span>Название ссылки 4</span></a>        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 5" width="30" /><span>Название ссылки 5</span></a>        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 6" width="30" /><span>Название ссылки 6</span></a>        
<a href="#" class="fisheyeItem"><img src="Адрес картинки 7" width="30" /><span>Название ссылки 7</span></a>        
</div>       
<script type="text/javascript" src="http://all4you.at.ua/desktop/scriptformenu2/jquery.js"></script>        
<script type="text/javascript" src="http://all4you.at.ua/desktop/scriptformenu2/interface.js"></script>       
</div>        
<script type="text/javascript">        

$(document).ready(        
function()        
{        
$('#fisheye').Fisheye(        
{        
maxWidth: 20,        
items: 'a',        
itemsText: 'span',        
container: '.fisheyeContainter',        
itemWidth: 60,        
proximity: 10,        
halign : 'center'        
}        
)        

}        
);        

</script>

Если вам помог этот скрипт,то ставьте мне в репутацию
 
Форум » Cкрипты для ucoz » Меню » Горизонтальное меню с иконками (Скрина к сожалению нет)
  • Страница 1 из 1
  • 1
Поиск: