Выкладываю свой скриптик раздвигающегося меню. По несколько строчек HTML, CSS и jQuery)
В таблицу стилей (CSS):
Code
.menusha a {
display: block;
text-decoration: none;
padding: 1px 0 2px 7px;
opacity: 0.7;
font-size: 13px;
}
display: block;
text-decoration: none;
padding: 1px 0 2px 7px;
opacity: 0.7;
font-size: 13px;
}
В нижнюю часть сайта ближе к :
Code
<script type="text/javascript">
$('.menusha a').hover(function(){
$(this).stop().animate({'paddingLeft':'17px','opacity':'1','fontSize':'14px'})
}, function(){
$(this).stop().animate({'paddingLeft':'7px','opacity':'0.7','fontSize':'13px'})
});
</script>
$('.menusha a').hover(function(){
$(this).stop().animate({'paddingLeft':'17px','opacity':'1','fontSize':'14px'})
}, function(){
$(this).stop().animate({'paddingLeft':'7px','opacity':'0.7','fontSize':'13px'})
});
</script>
Сам код меню:
Code
<div class="menusha">
<a href="#">Пункт 1</a>
<a href="#">Пункт 2</a>
<a href="#">Пункт 3</a>
<a href="#">Пункт 4</a>
<a href="#">Пункт 5</a>
<a href="#">Пункт 6</a>
<a href="#">Пункт 7</a>
<a href="#">Пункт 8</a>
<a href="#">Пункт 9</a>
</div>
<a href="#">Пункт 1</a>
<a href="#">Пункт 2</a>
<a href="#">Пункт 3</a>
<a href="#">Пункт 4</a>
<a href="#">Пункт 5</a>
<a href="#">Пункт 6</a>
<a href="#">Пункт 7</a>
<a href="#">Пункт 8</a>
<a href="#">Пункт 9</a>
</div>
Посмотреть демо Плавное меню от TRANE73
Другие новости |
Поделиться ссылкой
|