Используйте медиа запрос или если в javascript - PullRequest
Новая
       5

Используйте медиа запрос или если в javascript

0 голосов
/ 25 марта 2020

Так что я работаю на этой странице https://www.pacificotest.com.pe/.
- Мне нужно знать, что делать, чтобы панель автозаполнения не отделялась от окна поиска. Это происходит, когда высота 740px или меньше, а также мобильный. Как я могу это исправить.

Example 1 Example 1

CSS

.autocomplete-suggestions{
-webkit-transition: none !important;
transition: none !important;
}

.fixed2{
position: absolute !important;
top:430px !important;
z-index:100 !important;
}

.fix-searcher2{
top:490px !important;
z-index:100 !important;
}

.fixed{
position: fixed !important;
top:100px !important;
}

.fix-searcher1{
top:140px !important;
}

JS: 

$(function() {
  $('.autocomplete-suggestions').each(function(index) {
    $(this).addClass('fix-searcher' + (index + 1));
    $(this).addClass('js-searcher-' + (index + 1));
  });
});

$(window).scroll(function() {
  const $searcher1 = $('.aui .js-searcher-1');
  const emergencyBarHeight = 32;
  if ($(window).scrollTop() >= emergencyBarHeight) {
    $searcher1.removeClass("fix-searcher1").addClass("fixed");
  } else {
    $searcher1.removeClass("fixed").addClass("fix-searcher1");
  }
});

$(window).scroll(function() {
  const $searcher2 = $('.aui .js-searcher-2');
  const emergencyBarHeight = 40;
  if ($(window).scrollTop() >= emergencyBarHeight) {
    $searcher2.removeClass("fix-searcher2").addClass("fixed2");
  } else {
    $searcher2.removeClass("fixed2").addClass("fix-searcher2");
  }
});
...