• Страница 1 из 1
  • 1
Форум » Веб-разработка » HTML + CSS — коды » Спойлер открывающийся сверху
Спойлер открывающийся сверху
workman
Пятница, 15 Января 2016 | Сообщение 1
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Делюсь с здравомыслящими пользователями сайта Zornet.Ru, вот таким скриптиком. Может кому такая басня и пригодится. Например, под форму авторизации и профиля. У кого какая выдумка будет ...
стили CSS
Код
#block{display:none;width:500px;margin:0 auto;border:1px solid #FFF;background:#DEDEDE;box-shadow:1px 1px 1px rgba(0,0,0,.5)}
#block a{color:#000}
#block a:hover{color:red}
#open{display:block;text-align:center;margin-top:20px;font-size:20px;color:#C41919;}

JS
Код
<script>function facechange(objName){ if($(objName).css('display')=='none'){ $(objName).animate({height:'show'},400); }else{ $(objName).animate({height:'hide'},200); } }; </script>

HTML
Код
<div id="block"><ul><li><a href="#">Ccылка 1</a></li><li><a href="#">Ссылка 2</a></li></ul><p>Тут может быть любой контент. Например форма входа</p></div>

Ссылка по месту вызова
Код
<a id="open" href="#" onclick="facechange('#block');return false">Показать/скрыть</a>


СМОТРИМ


Сообщение отредактировал
workman - Пятница, 15 Января 2016, 03:51
Страна: (RU)
Kosten
Пятница, 15 Января 2016 | Сообщение 2
Оффлайн
Администраторы
Сообщений:44355
Награды: 70
workman, Круто ты намутил, вообще такой стиль и можно сказать навигацию в первые вижу.

Прикрепления: 3605775.png (12.3 Kb)
Страна: (RU)
workman
Пятница, 15 Января 2016 | Сообщение 3
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Цитата Kosten ()
Круто ты намутил, вообще такой стиль и можно сказать навигацию в первые вижу.
Да это разве круто? Так пустяшное дело )) Просто если у кого фантазия и мозги работают, то можно с помощью этого забабахать что-то интересненькое у себя на сайте, что должно будет скрыто
Страна: (RU)
Форум » Веб-разработка » HTML + CSS — коды » Спойлер открывающийся сверху
  • Страница 1 из 1
  • 1
Поиск: