xtr
-
Posts
5 -
Joined
-
Last visited
xtr's Achievements
Explorer (1/14)
0
Reputation
-
День добрый помогите доработать css Меню, что то у меня ничего не получается... Сам код стандартный: <ul id="topnav"> <li><a href="#">Меню 1</a></li> <li> <a href="#">Меню 2</a> <!--Здесь начинается подменю--> <span> <a href="#">Подменю 1</a> <a href="#">Подменю 2</a> <a href="#">Подменю 3</a> </span> <!--Заканчивается подменю--> </li> <li><a href="#">Меню 3</a></li> </ul> CSS ul#topnav { margin: 0; padding: 0; float: left; width: 970px; list-style: none; position: relative; font-size: 1.2em; background: url(topnav_stretch.gif) repeat-x; } ul#topnav li { float: left; margin: 0; padding: 0; border-right: 1px solid #555; } ul#topnav li a { padding: 10px 15px; display: block; color: #f0f0f0; text-decoration: none; } ul#topnav li:hover { background: #1376c9 url(topnav_active.gif) repeat-x; } ul#topnav li span { float: left; padding: 15px 0; position: absolute; left: 0; top:35px; display: none; width: 970px; background: #1376c9; color: #fff; /*--Bottom right rounded corner--*/ -moz-border-radius-bottomright: 5px; -khtml-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; /*--Bottom left rounded corner--*/ -moz-border-radius-bottomleft: 5px; -khtml-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; } ul#topnav li:hover span { display: block; } ul#topnav li span a { display: inline; } ul#topnav li span a:hover {text-decoration: underline;} Скрипт <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> инициирующий скрипт <script type="text/javascript"> $(document).ready(function() { $("ul#topnav li").hover(function() { $(this).css({ 'background' : '#1376c9 url(topnav_active.gif) repeat-x'}); $(this).find("span").show(); } , function() { //on hover out... $(this).css({ 'background' : 'none'}); $(this).find("span").hide(); }); }); </script> Нужно чтобы в подменю выпадало ещё одно меню столбиком (вертикально) Помогите всю голову сломал как сделать Да совсем забыл написать: тут можно посмотреть в действии http://mix-up.ru/demo/horizontal-dropdown-submenu/
-
Всё, вопрос снят. За неимением ответа решил проблемму другим путём.
-
<body> <div class="main"> <div class="left_col"> <div class="left1"></div> <div class="left2"></div> <div class="right_col"> <div class="right1"></div> <div class="right2"></div> <div class="right3"></div> </div> <div class="footer"></div> </div> </body> .main{margin: 0 auto; width: 960px;background:#ffffff;} .left_col {height:100%; width:366px;background:#ffffff;float:left;} .left1 {height:462px; width:366px;position:relative;} .left2 {height:371px; width:366px;margin:auto 0;} .right_col {height:100%; width:590px;float:left;} .right1{height:230px; width:590px;float:right;} .right2{} .right3{height:95px; width:590px;float:right;} Примерно так. Надо чтобы при увеличении right2 менялся, а точнее стремился к футеру left2. что бы их нижние границы были у футера в общем... В данный момент так не получается... Так же внутри left1 left2 right1 right2 right3 есть контент, его сюда не выкладывал ибо много получится.
-
В плане разметки и стилей?
-
Есть 2 колонки right и left В каждой из них находится по блоку right1 и left2 соответственно в исходном положении это выглядит примерно: при раскрытии контента в right1 блок увеличивается по высоте (там аккордеон) Соответственно это выглядит: в результате нужно , что бы при "раскрытии" right1 - left1 стремился к низу, ну скажем к футеру. Так никак не получается сделать, т.к. если ставишь везде высоту 100% то блок растягивается на экран, а если контента больше чем на экран всё остаётся как на 2й картинке. Поможите советом как реализовать???