Форум iSofter
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
Страница 1 из 11
Форум » ***Всё для Ucoz*** » Меню для ucoz » Анимированное меню для ucoz
Анимированное меню для ucoz
GrozaZoolДата: Четверг, 10.02.2011, 18:05 | Сообщение # 1

Главный админ

Сообщений: 142
Репутация: 12784
Статус: Offline

Красивое анимированное меню для ucoz! При наведении мышки на пункт меню, он затухает!

Установка:
Ставим в CSS это:

Code
<style type="text/css">  

      #menu {  
       background: #3e3e3e;  
       padding: 7px 25px 7px 25px;  
       text-align: center;  
       border: 5px solid #00b4ff;  
       }  

      #menu a {  
       font-variant: small-caps;  
       text-decoration: none;  
       font-weight: bold;  
       color: white;  
       font-size: 10pt;  
       padding: 7px;  
       font-family: Tahoma;  
       }  

      #menu a:hover {  
       background: #b52828;  
       }  

      </style>

Потом между <head> и </head> ставим это:

Code

<script type="text/javascript">  
$('#menu a').hover(function () {  
     $(this).animate({  
      opacity: 0.5  
     },  
     1000);  
},  
function () {  
     $(this).animate({  
      opacity: 1  
     },  
     1000);  
});  
</script>

Ну и теперь ставим само меню, куда нужно, вот код:

Code
<div id="menu">  
       <a href="/">  
        главная  
       </a>  
       <a href="/forum">  
        форум  
       </a>  
       <a href="/load">  
        софт  
       </a>     
       <a href="/publ">  
        фильмы  
       </a>  
       <a href="/index/8">  
        профиль  
       </a>  
       <a href="/index/10">  
        выход  
       </a>  
      </div>


 
Форум » ***Всё для Ucoz*** » Меню для ucoz » Анимированное меню для ucoz
Страница 1 из 11
Поиск:



Яндекс.Метрика
Copyright © 2010-2016г