Выдвижное меню

@Moze · Регистрация: 02.06.2015

Author24 — интернет-сервис помощи студентам

Здравствуйте, каким образом можно "раздвинуть" страничку при нажатии на некую кнопку?

Пример:

После клика:

Было бы замечательно, если это бы разворачивалось через анимацию

Заранее благодарен :3

@Moze · 10.12.2015, 23:34 **[ТС]**

@CyberGeniuz · 11.12.2015, 05:03

HTML5

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<style>
body{
height:1000px;
 
}
#slide_div {
background-color:red;
height:300px;
width:100%;
display:none;
}
</style>
<script>
$(document).on('click', '#button', function(){
$("#slide_div").toggle('slow');
 });
</script>
</head>
<body>
<div id="slide_div"></div>
<a id="button">Нажми меня</a>
</body>
</html>

@Анар · 11.12.2015, 06:22

Moze, или на чистом css http://jsfiddle.net/anarmus/ga3862x2/2/ далее оформляйте как хотите.

Новые блоги и статьи
В чем разница между px, in, mm, pt, dip, dp, sp InfoMaster 20.01.2025 В мире цифрового дизайна и разработки интерфейсов правильный выбор единиц измерения играет ключевую роль в создании качественного пользовательского опыта. История развития систем измерений для. . .	Как изменить адрес удалённого репозитория (origin) в Git InfoMaster 20.01.2025 В терминологии Git термин origin является стандартным именем для основного удаленного репозитория, с которым взаимодействует локальная копия проекта. Когда разработчик клонирует репозиторий с. . .	Как переместить последние коммиты в новую ветку (branch) в Git InfoMaster 20.01.2025 При работе над проектом часто возникают ситуации, когда необходимо изолировать определенные изменения от основной линии разработки. Это может быть связано с экспериментальными функциями, исправлением. . .	Как вернуть результат из асинхронной функции в JavaScript InfoMaster 20.01.2025 Асинхронное программирование представляет собой фундаментальную концепцию в JavaScript, которая позволяет выполнять длительные операции без блокировки основного потока выполнения программы. В. . .	Какой локальный веб-сервер выбрать InfoMaster 19.01.2025 В современной веб-разработке локальные веб-серверы играют ключевую роль, предоставляя разработчикам надежную среду для создания, тестирования и отладки веб-приложений без необходимости использования. . .	Почему планшеты и iPad уже не так популярны, как раньше InfoMaster 19.01.2025 Эра революционных инноваций История планшетных компьютеров началась задолго до того, как эти устройства стали привычными спутниками нашей повседневной жизни. В начале 1990-х годов появились первые. . .
Как самому прошить BIOS ноутбука InfoMaster 19.01.2025 BIOS (Basic Input/ Output System) представляет собой важнейший компонент любого компьютера или ноутбука, который обеспечивает базовое взаимодействие между аппаратным и программным обеспечением. . .	Какой Linux выбрать для домашнего компьютера InfoMaster 19.01.2025 Современные реалии выбора операционной системы В современном мире выбор операционной системы для домашнего компьютера становится все более важным решением, которое может существенно повлиять на. . .	Как объединить два словаря одним выражением в Python InfoMaster 19.01.2025 В мире программирования на Python работа со словарями является неотъемлемой частью разработки. Словари представляют собой мощный инструмент для хранения и обработки данных в формате "ключ-значение". . . .	Как без исключения проверить существование файла в Python InfoMaster 19.01.2025 При разработке программного обеспечения на Python часто возникает необходимость проверить существование файла перед выполнением операций с ним. Это критически важная задача, которая помогает избежать. . .	Как определить, содержит ли строка подстроку в JavaScript InfoMaster 19.01.2025 При разработке веб-приложений часто возникает необходимость выполнять различные операции со строками, среди которых особое место занимает поиск подстрок. JavaScript предоставляет несколько встроенных. . .	Что такое метаклассы в Python InfoMaster 19.01.2025 Метаклассы в Python представляют собой один из самых мощных и одновременно сложных механизмов языка, позволяющий программистам контролировать процесс создания классов. По своей сути, метакласс. . .

Выдвижное меню

Решение

Решение

@Moze 10 / 10 / 4 Регистрация: 02.06.2015 Сообщений: 92
		1
	Выдвижное меню 10.12.2015, 22:13. Показов 1486. Ответов 3 Метки нет (Все метки) Здравствуйте, каким образом можно "раздвинуть" страничку при нажатии на некую кнопку? Пример: После клика: Было бы замечательно, если это бы разворачивалось через анимацию Заранее благодарен :3 0

@Moze 10 / 10 / 4 Регистрация: 02.06.2015 Сообщений: 92
	10.12.2015, 23:34 [ТС]	2
	0

@Анар 225 / 216 / 89 Регистрация: 12.09.2015 Сообщений: 986
	11.12.2015, 06:22	4
	Сообщение было отмечено Moze как решение Решение Moze, или на чистом css http://jsfiddle.net/anarmus/ga3862x2/2/ далее оформляйте как хотите. 1

Опции темы