Index · Правила · Поиск· Группы · Регистрация · Личные сообщения· Вход

Список разделов Веб-строительство и интернет-проекты
 
 
 

Раздел: Веб-строительство и интернет-проекты Выпадающее вверх меню 

Создана: 14 Июня 2010 Пон 11:09:13.
Раздел: "Веб-строительство и интернет-проекты"
Сообщений в теме: 35, просмотров: 7987

На страницу: Назад  1, 2, 3  Вперёд
  1. 14 Июня 2010 Пон 11:09:13
    Уважаемые интернет -гуру. пожалуйста подскажите.
    Есть такое меню
    HTML
    <ul id="cssmenu">
    <li><a href="#">новости</a>
    </li>
    <li><a href="#">модели</a>
    <ul>
    <li><a href="#">Дети</a></li>
    <li><a href="#">Юноши с 16 лет</a></li>
    <li><a href="#">Девушки с 16 лет</a></li>
    </ul>
    </li>
    <li><a href="#">проекты</a>
    <ul>
    <li><a href="#">Ссылка 1</a></li>
    <li><a href="#">Ссылка 2</a></li>
    </ul>
    </li>
    <li><a href="#">свободный кастинг</a>
    <ul>
    <li><a href="#">Ссылка 1</a></li>
    <li><a href="#">Ссылка 2</a></li>
    </ul>
    </li>
    <li><a href="#">преподаватели</a>
    <ul>
    <li><a href="#">Ссылка 1</a></li>
    <li><a href="#">Ссылка 2</a></li>
    </ul>
    </li>
    <li><a href="#">о нас</a>
    <ul>
    <li><a href="#">Ссылка 1</a></li>
    <li><a href="#">Ссылка 2</a></li>
    </ul>
    </li>
    <li><a href="#">наши работы</a>
    <ul>
    <li><a href="#">Публикации</a></li>
    <li><a href="#">Наши работы</a></li>
    </ul>
    </li>
    </ul>


    и СSS
    ul#cssmenu {
    width:705px;
    margin: 0;
    border: 0 none;
    padding: 0;
    list-style: none;
    background: #ffffff;
    height: 20px;
    font: bold 12px/28px Verdana, Arial;

    }

    ul#cssmenu li {
    margin: 0;
    border: 0 none;
    padding: 0;
    float: left;
    display: inline;
    list-style: none;
    position: relative;
    height: 25px;

    }

    ul#cssmenu ul {
    margin: 0;
    border: 0 none;
    padding: 0;
    width: 160px;
    list-style: none;
    display: none;
    position: absolute;
    top: 30px;
    left: 0;

    }

    ul#cssmenu ul:after {
    clear: both;
    display: block;
    font: 1px/0px serif;
    content: ".";
    height: 0;
    visibility: hidden;

    }

    ul#cssmenu ul li {
    width: 150px;
    float: left;
    display: block !important;
    display: inline;

    }

    /* Main Menu */
    ul#cssmenu a {
    border: 0px;
    padding: 0 10px;
    float: none !important;
    float: left;
    display: block;
    border-bottom: #000000 1px solid;
    background: #ffffff;
    color: #000000;
    font: bold 12px/28px Verdana, Arial;
    text-decoration: none;
    height: auto !important;
    height: 1%;
    }

    /* Main Menu Hover */
    ul#cssmenu a:hover,
    ul#cssmenu li:hover a,
    ul#cssmenu li.iehover a {
    background: #000000;
    color:#ffffff;

    }

    /* Second Menu */
    ul#cssmenu li:hover li a,
    ul#cssmenu li.iehover li a {
    float: none;
    background: #000000;
    color: #ED1B24;

    }

    /* Second Menu Hover */
    ul#cssmenu li:hover li a:hover,
    ul#cssmenu li:hover li:hover a,
    ul#cssmenu li.iehover li a:hover,
    ul#cssmenu li.iehover li.iehover a {
    border-top: 1px solid #FFFFFF;
    background: #000000;
    color:# ED1B24;

    }

    ul#cssmenu ul ul {
    display: none;
    position: absolute;
    top: 0;
    left: 170px;

    }

    ul#cssmenu li:hover ul ul,
    ul#cssmenu li.iehover ul ul {
    display: none;
    }

    ul#cssmenu li:hover ul,
    ul#cssmenu ul li:hover ul,
    ul#cssmenu li.iehover ul,
    ul#cssmenu ul li.iehover ul {
    display: block;
    }

    Проблема в том, что я никак не могу сделать его выпадающем вверх, хотя думаю что это возможно....через z-index или отрицательные значения margin. Подскажите если можете. Вопрос жизни и смерти
  2. Olldman


    Частый гость


    Более 10 лет на форумеМуж.
    18 Июня 2010 Птн 18:35:36
    #nav li:hover {position:relative; z-index:300;background:#000;} 1 - при наведении фон меняется на черный
    #nav li:hover > a {text-decoration:none; color:#FFF;} 1 - при наведении цвет шрифта меняем на белый
    #nav li ul li{background:#000;} 2-й уровень - фон черный
    #nav li ul li > a{color:#FFF;} 2-й уровень - цвет белый
    #nav li ul li:hover > a{color:#F00;} 2-й уровень активный красный
  3. 21 Июня 2010 Пон 13:44:10
    Рискуя показатьсья совсем уж бестолковым....хотя именно слово точно и отображает мой уровень познаний в CSS, нельзя ли поподробнее, где именно менять 3-и последние строчки, отдельно когда их дописываю....такая чушь получается)
  4. 22 Июня 2010 Втр 21:01:03
    Ну все таки..если не трудно подскажите...у меня где то ваши коды конфликтуют с более ранними...я никак не могу это победить
  5. 12 Июля 2010 Пон 17:50:24
    В принципе тему ,можно закрыть, хотя в ней содержится весьма интересная информация.
  6. 15 Июля 2010 Чтв 22:11:38
    Продолжение этой темы...в теме "Разовая работа". )))
На страницу: Назад  1, 2, 3  Вперёд