0

У меня есть хедер, элементы которого при скролле получают доп. css стили. Однако, нужно чтобы это условие работало только при ширине экрана/устройства < 920 пикселей.

Пробую выполнить if ($(window).scrollTop() > 40, $(window).width() < 920)— не работает. Задача в том, чтобы условие выполнялось для ширины 920 и меньше, не затрагивая имеющиеся стили. Помогите, пожалуйста.

function changecolor() {
    var scroll = $(window).scrollTop();
    if (scroll > 40) {
      $("#c1").css("color" , "#3a3a3a");
      $("#m2").css("background" , "#rgba(255,255,255,.8)");
      $(".c-color").css("color" , "#3a3a3a");
      $(".m-color").css("color" , "#3a3a3a");
    }
    else {
      $("#c1").css("color" , "#fff");
      $("#m2").css("background" , "rgba(255,255,255,0)");
      $(".c-color").css("color" , "#fff");
      $(".m-color").css("color" , "#f4f4f4");
    }
};
9
  • 2
    Попробуйте if ($(window).scrollTop() > 40 && $(window).width() < 920) 14 фев 2020 в 10:00
  • Не работает. :(
    – Стас
    14 фев 2020 в 10:07
  • 1
    Покажите ваш полный код. 14 фев 2020 в 10:13
  • Добавил код в начальном посте.
    – Стас
    14 фев 2020 в 10:17
  • тот код который вы показали должен выполняться только при ширене <920?
    – qwerty
    14 фев 2020 в 10:40

1 ответ 1

0

как-то так

 $(document).ready(function(){
   $(window).scroll(function(){
     if ( $(window).width() <920 ) {
       var scroll = $(window).scrollTop();
        if (scroll > 40) {
          $("#overhead").css("background" , "rgba(255,255,255,1)");
          $(".c-1").css("color" , "blue");
          $(".m-1").css("color" , "blue");
        }
        else{
          $("#overhead").css("background" , "grey");
          $(".c-1").css("color" , "red");
          $(".m-1").css("color" , "orange");
        }
      }
  });
});
4
  • Не работает к сожалению.
    – Стас
    14 фев 2020 в 11:13
  • @Стас добавь тут снипет или на кодеопен или еще куда залей
    – qwerty
    14 фев 2020 в 11:27
  • codepen.io/dis6/pen/NWqxzNy
    – Стас
    14 фев 2020 в 11:50
  • @Стас поправил вроде работает вместе всего своего js этот вставь
    – qwerty
    14 фев 2020 в 12:08

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.