Привет всем. Есть задача... не знаю пока как подойти к ней и решить.
есть небольшое горизонтальное меню:
<style type="text/css">
div.mainMenu {
background:#eaeaea;
height:21px;
padding:10px;
}
div.mainMenu a {
font:normal 12px Arial, Helvetica, sans-serif;
color:#333;
margin:0 15px;
}
div.mainMenu a:hover {
text-decoration:none;
}
div.podMenu{
display:none;
padding:10px;
background:#000;
}
div.podMenu a{
font:normal 12px Arial, Helvetica, sans-serif;
color:#FFF;
}
</style>
</head>
<body>
<div class="mainMenu">
<a href="#">Афиша города</a>
<a href="#">Объявления</a>
</div>
<div class="podMenu afisha">
<a href="#">Кинотеатры</a>
<a href="#">Мероприятия города</a>
<a href="#">Музеи</a>
<a href="#">Театры</a>
</div>
<div class="podMenu advertisement">
<a href="#">Продам</a>
<a href="#">Куплю</a>
<a href="#">Обменяю</a>
</div>
</body>
по умолчанию <div class="podMenu"> скрыт
мне надо чтобы при клике по ссылке "афиша города" открылся блок с классом "afisha", при клике по "Объявления" предыдущий див скрылся а открылся блок с классом "advertisement".
Вот как такое решить...не могу придумать....