Раскрывающийся контейнер при клике | |
| Это красивый эффект появление описание или изображение по клику. Также идет закрытие элемента или объекта на вашем сайте. Вы могли увидеть такую работу на многих интернет ресурсах, где больше применяется в различных мануалах. Ведь очень много информации можно спрятать и при желании ее открыть. Подключить все модули и на них размещение сделать. Благодаря Jquery все будет визуально выделяться, но и на стили CSS есть возможность выставит, сто после появятся кнопки, здесь сам веб мастер решает. Главное, что все отрабатывая, и DEMO ниже можно понять, как все будет работать после как все поставите. Кто-то подумает на споллер и будет прав, функциональность похоже, но сам выезд плавнее стандартного. HTML Код <div class="view-source"> <a href="#">ZORNET.RU</a> <div class="hide">Нинтендо Супер NES Classic Edition является спорным, так как продукт был объявлен. Хотя концепция небольшой игровой консоли с отличной эмуляцией была с энтузиазмом воспринята геймерами, прошлогодняя казнь явно не хватало. </div> </div> <div class="view-source"> <a href="#">ZORNET.RU 2</a> <div class="hide">Решение Nintendo убить производство NES Classic оставило тысячи геймеров без возможности купить устройство. Super NES Classic Edition запущен, с несколькими обзорами онлайн. </div> </div> <div class="view-source"> <a href="#">ZORNET.RU 3</a> <div class="hide">Для простоты все ссылки на NES и SNES можно считать относящимися к устройствам Nintendo, запущенным в 2016 и 2017 годах, если специально не указано иное.</div> </div> Ну и в нижнюю часть сайта или отдельным файлом вставляем. Код <script> $(function(){ $('.view-source .hide').hide(); $a = $('.view-source a'); $a.on('click', function(event) { event.preventDefault(); $a.not(this).next().slideUp(500); $(this).next().slideToggle(500); }); }); </script> На этом все! Демонстрация | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 9 | |
Возможно он забыл ставить автором тебя )
 | |
