Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.07.2014, 19:16
Интересующийся
Отправить личное сообщение для Nevrali Посмотреть профиль Найти все сообщения от Nevrali
 
Регистрация: 27.03.2014
Сообщений: 12

Функция для скрытых элементов
С помощью toggle по клику появляется Раздел 1, но не получается пррисвоить ей функцию , которая по клику в Раздел 1 изменяла бы видимость подразделов.
Хочу что бы по клику по Разделам появлялись подразделы.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>index.php</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript" src="js/lib/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/lib/jquery-ui.min.js"></script>
<script>
$(document).ready(function () {   
$("#menu li:first").click(function () {
$(".menu1").toggle(200); 
$("#menu2").click(function () {
$("#menu2").toggle(200);  
}); 
});
});
</script>
<style>
*{
padding: 0;
margin: 0;
border: none;
overflow:hidden
}
body {
background: rgb(197, 197, 197);
width: 100%;
height: 100%;
} 
li{
list-style:none
}
.menu1,.menu2{
display:none;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<ul id="menu">
        <li><a href="#">МЕНЮ</a></li>
        <li>
                <a href="#" class="menu1">Раздел 1</a>
                <ul class="menu2">
                        <li><a href="#">Подраздел</a></li>
                        <li><a href="#">Подраздел</a></li>
                        <li><a href="#">Подраздел</a></li>
                        <li><a href="#">Подраздел</a></li>
                </ul>
        </li>
</ul>
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 27.07.2014, 19:40
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

Nevrali,
строка 11 у вас будет навешивать клик за кликом ... может готовое взять коих на форуме 100500
Выпадающее меню на jquery
Ответить с цитированием
  #3 (permalink)  
Старый 28.07.2014, 13:54
Интересующийся
Отправить личное сообщение для Nevrali Посмотреть профиль Найти все сообщения от Nevrali
 
Регистрация: 27.03.2014
Сообщений: 12

Готовое конечно проще, но разобраться самому в этом разумнее. Спасибо за направление
Я думаю, что функцию вызывать по имени нужно
Ответить с цитированием
  #4 (permalink)  
Старый 28.07.2014, 14:24
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,050

Nevrali,

<!DOCTYPE HTML>
<html>
<head>
<title>index.php</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/style.css" />
 <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
	$(document).ready(function ()
	  {
	    $("#menu li:first").click(function (event)
	      {event.preventDefault();
	        $(this).next().toggle(200);}
	    );
	    $(".menu1").click(function (event)
	      {event.preventDefault();
	        $(this).next().toggle(200);
	      }
	    );
	  }
	);
</script>
<style>
*{
padding: 0;
margin: 0;
border: none;
overflow:hidden
}
body {
background: rgb(197, 197, 197);
width: 100%;
height: 100%;
}
li{
list-style:none
}
#menu > li:nth-child(n + 2),.menu2{
display:none;
}

</style>
</head>
<body>
<ul id="menu">
        <li><a href="#">МЕНЮ</a></li>
        <li>
                <a href="#" class="menu1">Раздел 1</a>
                <ul class="menu2">
                        <li><a href="#">Подраздел</a></li>
                        <li><a href="#">Подраздел</a></li>
                        <li><a href="#">Подраздел</a></li>
                        <li><a href="#">Подраздел</a></li>
                </ul>
        </li>
</ul>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Пользовательская функция для графиков aleksey.danchin Общие вопросы Javascript 1 15.06.2014 13:22
поиск классов внутри тега yozuul jQuery 24 14.06.2013 22:00
Решение проблемы кодировок для AJAX и PHP без iconv (cp1251 в AJAX) Serge Ageyev AJAX и COMET 10 24.04.2013 20:48
Универсальная функция для формы Nightmare Общие вопросы Javascript 5 16.04.2010 18:42
Событие change для всех элементов exvion jQuery 2 25.01.2010 18:18