http://s020.radikal.ru/i711/1402/a4/13a28a6102e4.png
Html:
<html>
<head>
<script>
document.addEventListener('click', function(event){
event.target.classList.toggle('anim');
});
</script>
<style>
html, body { margin:0;overflow:hidden;height:100%; }
.header {
width:100%;
height:40px;
background:#808080;
}
#content {
min-width:1000px;
max-width:1400px;
margin:0 auto;
height:100%;
}
.main {
height:100%;
background:#FFDFDF;
}
.nav {
height:60px;
background:#C0C0C0;
}
.dialog {
height:100%;
float:right;
background:#BBDDFF;
}
.userlist {
background:#FFDFDF;
}
.sidebar {
width:200px;
height:100%;
float:right;
background:#C6FFE2;
}
.anim { width:250px; }
</style>
</head>
<body>
<div class="header"></div>
<div id="content">
<div class="sidebar">Sidebar</div>
<div class="nav">Navigation</div>
<div class="main">UserList</div>
<div class="dialog">Dialog</div>
</div>
</body>
</html>
Где UserList и Dialog, Dialog - не должно быть изначально, при нажатий на UserList появляется посредством уменьшения размера UserList до 250px; Что подскажите?
RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.
Все вопросы, добавленные на сайт ответов Google, мы скопировали и сохранили здесь. Имена старых пользователей также отображены в том виде, в котором они существовали ранее. Только нужно заново пройти регистрацию, чтобы иметь возможность задавать вопросы, или отвечать другим.
Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.