Как показать/скрыть divs

Question

Я пытаюсь понять, как это сделать ... У меня есть 4 divs, которые я хочу показать и скрыть по одному. Ссылка на divs находится в отдельном вложенном div. Вот мой код:

<div id="container"> 
    <div class="roundbox"> 
     <ul> 
      <li class="t"> 
       <a href="">Main</a> 
      </li> 
      <li class="e"> 
       <a href="">News</a> 
      </li> 
      <li class="t"> 
       <a href="">History</a> 
      </li> 
      <li class="e"> 
       <a href="">Contact</a> 
      </li> 
     </ul> 
    </div> 
    <div class="inceptioncontent"> 
     <div class="content"> 
      <div class="contentnest"> 
       <div id="1"></div> 
       <div id="2"></div> 
       <div id="3"></div> 
       <div id="4"></div> 
      </div> 
     </div> 
    </div> 
</div> 

Я хочу Главная, Новости, Контакты, и история ссылки, чтобы показать/скрыть соответствующие дивы в contentnest дел. Есть идеи? Благодаря!

Answer 1

JQuery отлично справляется со своей задачей. Это выглядит как хорошее место для начала: http://papermashup.com/simple-jquery-showhide-div/

Answer 2

Кажется, что вы ищете раскрывающееся меню. Вы можете это сделать: Кодирование в Javascript + css (с фреймворком вроде jQuery будет проще) ; С Css ; Загрузка плагина

Я думаю, что «Css only» - лучший способ, jQuery - это классный и скачать плагин, это самый простой способ, но вам нужно, чтобы js проводника пользователя был включен.

Вы можете проверить, как это сделать только с помощью CSS здесь:

https://www.grc.com/menudemo.htm