Показать сообщение отдельно
  #12 (permalink)  
Старый 02.02.2014, 14:06
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Roman-lev,
вариант
<!DOCTYPE html>
<html>
<head>

<meta charset='UTF-8'>
<title></title>
<style>
.sec-container {
	position:absolute;
	width:100%;
	height:47px;
	background-color:#000;
	margin-top:9px;
	display:none;
}
.catalog-bar-container {
	position:relative;
	width:1280px;
	margin:0 auto;
}
.catalog-bar a {
	font-size:12px;
	color:#FFF;
}
.catalog-bar {
	position:absolute;
	right:0;
	margin-top:13px;
}

</style>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(function () {
    var d = $("#catalog"),
        f = $("div.sec-container");
    d.mouseenter(function (event) {
        f.stop(true, true).slideDown("slow")
    })

    f.mouseleave(function (event) {
        f.stop(true, true).slideUp(300)
    })
});
  </script>
</head>

<body>

            <div class="sitebar">
            	<ul id="bar">
                    <li id="catalog"><a href="#">Каталог</a>
                    </li>
                </ul>
            </div>
        <div class="sec-container">
        	<div class="catalog-bar-container">
            	<div class="catalog-bar">
        		<a href="#">1</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">2</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">3</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">4</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">5</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">6</a>&nbsp;&nbsp;&nbsp;
                <span style="color:#ffde00;font-size:12px;">•</span>&nbsp;&nbsp;
        		<a href="#">7</a>
                </div>
        	</div>
        </div>


</body>
</html>
Ответить с цитированием