1

Есть 2 массива, нужно менять их местами, когда ширина экрана меняется. Так как я начинающий, я использовал элементарный if else сработал правда, но теперь оба массива работают (один задает marginleft другой marginright).
Помогите пожалуйста.

вот код

   var margin =["-150px","-140","-130px","-120px",
                "-110px","-100px","-90px","-80px",
                "-70px","-60px"];

   var marginScreen =["200px","190px","180px","170px",
                      "160px","150px","140px","130px",
                      "120px","110px","100px","90px"];

  var screen = document.documentElement.clientWidth;
  if (screen <= 1080) {
    margin = marginScreen; 
     withAp.style.marginLeft = marginScreen[nextOne]; //nextOne это переменная для массива которое тут не важен..
     withAp.style.opacityForLeft = opacityForLeft[nextOne];
  }

0

2 ответа 2

1

Создается отдельная переменная (marginSetCurrent), которая в зависимости от условий указывает на один из массивов. При этом сами массивы не модифицируются.

var marginSet1 = [-150, -140, -130, -120, -110, -100, -90, -80, -70, -60]
  , marginSet2 = [200, 190, 180, 170, 160, 150, 140, 130, 120, 110, 100, 90]
  , screen = document.documentElement.clientWidth
  , marginSetCurrent = screen <= 1080 ? marginSet2 : marginSet1;
withAp.style.marginLeft = marginSetCurrent[nextOne] + 'px';
1
  • а я не знал что можно так с запятыми писать .Спасибо большое за время потраченную и за обьяснения
    – Randall
    21 апр 2017 в 19:09
0

Чувак, если возможно, то лучше юзай медиа-запросы в css для установки нужных стилей под соответствующую ширину экрана. Например,

//установка маргина при ширине экрана больше 760px
@media (min-width: 760px){
 #withAp{
  margin: 0 auto;
 }
}

//установка маргина при ширине экрана меньше 760px
@media (max-width: 760px){
 #withAp{
  margin: 0 20px;
 }
}
1
  • тут при скролле картинка должна двигаться если пикселей больше 1080 то она начинает свою позицию с право если меньше то центра и двигается .Такое невозможно реализовать при помощи медиа-запросов.
    – Randall
    21 апр 2017 в 19:21

Ваш ответ

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

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