Растягивающийся поиск и исчезающее меню сайта

 
Посетитель
small user social cms
Медаль
Сообщений: 273
Добрый день пробую реализовать растягивающийся поиск и исчезающее меню сайта.
Вот так:
Растягивающийся поиск и исчезающее меню сайта
сайт для примера prom.ua

Получается вот так:
Растягивающийся поиск и исчезающее меню сайта

Добрые люди подскажите как реализовать задуманное?
Редактировалось: 1 раз (Последний: 12 мая 2017 в 14:51)
Посетитель
small user social cms
Медаль
Сообщений: 134
Код PHP:
  1.  
  2. <script>
  3. $('селектор_поля_поиска').focus(function(){
  4. $('див_который_будем затенять').append('<div class="див_которым_будем_затенять"></div>');
  5. });
  6. $('селектор_поля_поиска').focusout(function(){
  7. $('див_которым_будем_затенять').remove();
  8. });
  9. </script>
  10.  
  11. <style>
  12. .див_который_будем затенять{
  13. position: relative;
  14. }
  15.  
  16. .див_которым_будем_затенять{
  17. position: absolute;
  18. width: 100%;
  19. height: 100%;
  20. background: rgba(0, 0, 0, 0.5);
  21. z-index: 1000;
  22. }
  23. </style>
  24.  
Затенение, наверное, приблизительно так v
Редактировалось: 3 раз (Последний: 12 мая 2017 в 17:32)
В начало страницы
Предыдущая темаСледующая тема Перейти на форум:
Быстрый ответ
Чтобы писать на форуме, зарегистрируйтесь или авторизуйтесь.