@Epic18

Применение DIV в HTML?

Имеется вот такой макет, как сделать так что бы при выборе меню в левую колонку загружалось необходимая информация.
Вроде делается это с помощью "DIV" блоков, но у меня нету примеров.
5dc50b9dbabd9054212281.jpeg

<header>   <!--Шапка и меню -->
			<ul id="navbar">
				<li> <a href="#" >Меню 1 </a> </li>
				<li> <a href="#" >Меню 2 </a> </li>
				<li> <a href="#" >Меню 3 </a> </li>
			</ul>	
    </header>
	   
	   
		<div id="leftColumn">
			
			<!--Меню 1 -->
			<div id="me1"> 
			
			</div>
			
			
			<!--Меню 2 -->
			<div id="me2">
			
			</div>
			
			
			<!--Меню 3 -->
			<div id="me3"> 
			
			</div>
			
		</div>
  • Вопрос задан
  • 75 просмотров
Решения вопроса 1
@Epic18 Автор вопроса
Вопрос решен. Применил javascript.
function openbox(id){
			var container = document.querySelector("#leftColumn");
			var elements = container.querySelectorAll("div.element > div");
				for(var i=0; i<elements.length; i++){
					elements[i].style.display = (elements[i].id == id) ? 'block' : 'none' ;
				}
		}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
criticalsomethoughts
@criticalsomethoughts
UI\UX Developer, Project Manager
Это называется tabs(табы) - вот вам пример с codepen, в нем показана техническая реализация без js. На codepen примеров куча.
Пример - Link
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы