Модераторы: Illuminaty

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Помогите решить проблему с выпадащим меню 
V
    Опции темы
LeD4eG
Дата 21.2.2011, 22:06 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



не могу никак победить проблему с выпадающим меню. цель простая: при наведении на ссылку должно появляться меню с ссылками.
проблема: ссылки не кликабельны. то есть меню появляется, но по ссылкам не пройтись. smile 

ссылка: http://for-help001.hut2.ru/

помогите, пожалуйста, разобраться!

--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
ayax2005
Дата 21.2.2011, 22:52 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


echo $smile
**


Профиль
Группа: Участник
Сообщений: 516
Регистрация: 17.4.2008
Где: Питер

Репутация: 3
Всего: 11



Ну миллион же раз эта задача решена.
li:hover ul{display:block;}


--------------------
все вопросы - из-за неверной формулировки задачи
PM MAIL ICQ   Вверх
LeD4eG
Дата 22.2.2011, 08:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



ayax2005, а у меня не так? посмотрите внимательней smile 
Код

#sub:hover ul {
    display: block;
    .....
    }


Код

......
<li id="sub">
      <ul id="sub_menu">
           ......



--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
ayax2005
Дата 22.2.2011, 08:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


echo $smile
**


Профиль
Группа: Участник
Сообщений: 516
Регистрация: 17.4.2008
Где: Питер

Репутация: 3
Всего: 11



а у вас не так. Вы забыли про #main_nav


--------------------
все вопросы - из-за неверной формулировки задачи
PM MAIL ICQ   Вверх
LeD4eG
Дата 22.2.2011, 10:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



а чем Вас смущает #main_nav?я, может чего-то не понимаю, объясните. smile 
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
masterweek
Дата 22.2.2011, 11:00 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


freelancer



Профиль
Группа: Участник
Сообщений: 31
Регистрация: 10.11.2008
Где: Ukrainian

Репутация: нет
Всего: нет



а как можно сделать выпадающее меню без js?попробуй

Это сообщение отредактировал(а) masterweek - 22.2.2011, 11:04
PM MAIL WWW ICQ Skype   Вверх
LeD4eG
Дата 22.2.2011, 11:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



masterweek, с помощью псевдокласса :hover для элемента списка. в нормальном состоянии меню скрыто, при наведении на элемент списка появляется меню.
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
masterweek
Дата 22.2.2011, 16:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


freelancer



Профиль
Группа: Участник
Сообщений: 31
Регистрация: 10.11.2008
Где: Ukrainian

Репутация: нет
Всего: нет



LeD4eG
ага,понял.))
так а почему у тебя не работает,если всё просто.
PM MAIL WWW ICQ Skype   Вверх
ayax2005
Дата 22.2.2011, 17:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


echo $smile
**


Профиль
Группа: Участник
Сообщений: 516
Регистрация: 17.4.2008
Где: Питер

Репутация: 3
Всего: 11



Изучил ваши стили получше.
из стиля #sub:hover #sub_nav уберите всё, кроме display:block (переместите в #sub #sub_nav). Сейчас ваша беда как раз в том, что absolute указан Не на месте.
Для верности в #sub:hover #sub_nav можно ещё добавить z-index:2;


--------------------
все вопросы - из-за неверной формулировки задачи
PM MAIL ICQ   Вверх
LeD4eG
Дата 22.2.2011, 22:32 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



masterweek, тут проблема не в методе, а в применении позиционирования. до того, как я выложил свою проблему сюда, писал проверяющий код - на минимальной странице (только с этим меню) всё работало. теперь с помощью ayax2005 я убедился в том, что именно создает неприятность.


ayax2005, спасибо, сейчас попробую.
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
LeD4eG
Дата 22.2.2011, 23:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



ayax2005, не помогло.
стили перенёс - проблема не уходит. в худшем случае рушится макет, в лучшем - остаётся всё без изменений. smile

пробовал изменить position: relative для главных ссылок, не помогает, задавал высоту-ширину для отображаемого блока - та же песня.

Это сообщение отредактировал(а) LeD4eG - 22.2.2011, 23:32
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
ayax2005
Дата 22.2.2011, 23:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


echo $smile
**


Профиль
Группа: Участник
Сообщений: 516
Регистрация: 17.4.2008
Где: Питер

Репутация: 3
Всего: 11



Код

#main_nav {
            position: absolute;
            top: 15px;
            left: 270px;
        }
        #main_nav li{
            display: inline;
            padding: 0 8px;
            border-left: 1px dotted #8b6619;
        }
        #main_nav li:first-child {
            border-left: none;
        }
        #main_nav li a {
            color: #8b6619;
            font-family: "Times New Roman", serif;
            font-size: 0.9em;
            font-weight: bold;
            text-decoration: none;
            outline: none;
        }
        #main_nav li a:hover {
            color: black;
        }
        #sub_nav {
            background-color: #d7ae46;
        }
        #sub:hover #sub_nav{
            display: block;
        }
        #sub_nav li{
            display: block;
            border-left: none;
        }
li ul{
    position: absolute;
    display: none;
    z-index: 5;
    }


Это сообщение отредактировал(а) ayax2005 - 22.2.2011, 23:56


--------------------
все вопросы - из-за неверной формулировки задачи
PM MAIL ICQ   Вверх
LeD4eG
Дата 23.2.2011, 00:46 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



ayax2005, спасибо большое за Ваше участие в решении моего вопроса.
проработал Ваш код. последняя директива скрывает меню в принципе и меню не возникает (чего и следовало ожидать).....

я обнаружил следующую интересную особенность: если беспорядочно кликать по ссылкам, по области отображения, то в какой-то момент мои стили начинают работать, то есть ссылки ниспадающего меню доступны, выделяются цветом при выделении.....я в ужасе!нет, я серьёзно!на самом деле начинает работать (локальная версия).....
идёт какой-то конфликт. описывал стили для псевдоклассов ссылок.....результат тот же.

ayax2005, Вы с чем-то подобным когда-нибудь сталкивались?

Это сообщение отредактировал(а) LeD4eG - 23.2.2011, 01:10
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
ayax2005
Дата 23.2.2011, 10:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


echo $smile
**


Профиль
Группа: Участник
Сообщений: 516
Регистрация: 17.4.2008
Где: Питер

Репутация: 3
Всего: 11



LeD4eG, Вы не поверите, но я сохранил вашу страницу и стиль на диск, доработал и у меня всё работает.
Работайте над ошибками.


--------------------
все вопросы - из-за неверной формулировки задачи
PM MAIL ICQ   Вверх
LeD4eG
Дата 23.2.2011, 11:05 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



ayax2005,  smile Вы не поверите, но у меня тоже работает, но почему-то через раз. при первом открытии страницы, например...
я бьюсь над этим меню уже вторую неделю. Вы можете мне хотя бы указать характер этих ошибок?
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
anjo
Дата 25.2.2011, 20:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 8
Регистрация: 23.2.2011

Репутация: нет
Всего: нет



Вот тут готовое решение.


а ниже скрипт(javascrip) для корректного отображения в IE

Код

function hmenuhover()
{
    if(!document.getElementById("hmenu"))
        return;
    var lis = document.getElementById("hmenu").getElementsByTagName("LI");
    for (var i=0;i<lis.length;i++)
    {
        lis[i].onmouseover=function(){this.className+=" iehover";}
        lis[i].onmouseout=function() {this.className=this.className.replace(new RegExp(" iehover\\b"), "");}
    }
}
if (window.attachEvent)
    window.attachEvent("onload", hmenuhover);


Это сообщение отредактировал(а) anjo - 25.2.2011, 20:45
PM MAIL   Вверх
LeD4eG
Дата 26.2.2011, 13:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



anjo, я проработал стили, которые Вы мне предложили в качестве готового решения. внёс изменения в свои стили. отображение стало проходить немного лучше. теперь через раз у меня получается пройтись по ссылкам подменю.
да, это можно гораздо быстрее создать на JS. но я новичок и пока я хочу научится делать это на CSS. я уже создавал меню на основе CSS. да, на странице, где есть только навигационное меню с выпадающим подменю, всё получалось. на реальной странице - не работает мой код. я не верстаю этот макет за деньги, поэтому готовые решения не совсем мне подходят. я хочу ПОНЯТЬ, где моя ошибка, чтобы в будущем не повторять её. я уже просмотрел множество готовых решений. и из каждого решения немного брал. не помогает. я хочу знать, где в МОЁМ коде ошибка.
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
LeD4eG
Дата 26.2.2011, 18:46 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 115
Регистрация: 29.9.2009
Где: Волгоград

Репутация: нет
Всего: 1



ayax2005anjo я нашёл решение проблемы!спасибо, что помогали мне!


PS ayax2005, а как бы мне узнать какие ошибки нашли Вы. так как всё-таки учусь, то мне интересно бы узнать это.

Это сообщение отредактировал(а) LeD4eG - 26.2.2011, 18:47
--------------------
Ты не успел стать для кого-то главным, кому-то очень нужным.....
PM MAIL   Вверх
Страницы: (2) [Все] 1 2 
Ответ в темуСоздание новой темы Создание опроса
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0935 ]   [ Использовано запросов: 20 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.