Раньше я создавал функцию, чтобы получить несколько свойств списка узлов. Затем с помощью свойств создайте визуальные эффекты. Выглядит это так:

var elem, celElem, elemTop = [],
  elemMag = [],
  elemBot = [],
  elemCent = [],
  winTop, winMag, winBot, winCent, i, x, len, elemCsokk = [],
  elemNo = [],
  elemCentValt = [],
  elemCentWinCent = [];

function getElem(el, cEl, fn) {
  if (el.length === undefined) {
    el = [el];
    cEl = [cEl];
  }
  elem = el;
  celElem = cEl;
  winTop = window.pageYOffset;
  winMag = window.innerHeight;
  winBot = winTop + winMag;
  winCent = winTop + (winMag / 2);
  for (i = 0, len = elem.length; i < len; i++) {
    elemTop[i] = 0;
    elemMag[i] = elem[i].offsetHeight;
    elemBot[i] = 0;
    elemCent[i] = 0;
    elemCsokk[i] = 0;
    topMag(elem[i]);
    fn(i);
  }

}

function topMag(y) {
  x = y;
  do {
    elemTop[i] += x.offsetTop;
    x = x.offsetParent;
  }
  while (x !== document.body);
  x = y;

  elemBot[i] = elemTop[i] + elemMag[i];
  elemCent[i] = elemTop[i] + (elemMag[i] / 2);
  elemCsokk[i] = (elemBot[i] - winTop) / winMag;

}

function opaCsokk(i) {
  elem[i].style.opacity = elemCsokk[i];
}

var element = document.querySelectorAll("div")

window.onscroll = function() {
  getElem(element, element, opaCsokk)
}

Функция работает очень хорошо, единственная проблема заключается в том, что выполнение функции каждый раз, когда происходит прокрутка, вызывает проблемы с производительностью. Итак, я решил, что переосмыслил функцию. В каждом свитке мне нужны свойства окна (winTop, winMag, winCent, winBot). Свойства элементов не меняются. Я думаю о том, что я могу создать большой массив (замена функции getElem), сохраняя списки узлов и их свойства. Таким образом, приведенный выше пример выглядит так (получение elemMag первого узла в списке узлов): bigArray[0]["elemMag"][0] с функцией:

var bigArray = [];

function addingToBigArray(elem) {
  var element = elem;
  for (var i = 0; i < element.length; i++) {
    bigArray[bigArray.length] = {
      elemMag[i]: element.offsetHeight,
      elemTop[i]: element.offsetTop
    }
  }
}

Но, к сожалению, свойство объекта не может быть массивом. Как я могу решить эту проблему, чтобы получить тот же результат, что и в приведенном выше примере, с функцией getElem?

0
Gergő Horváth 15 Мар 2018 в 02:49

1 ответ

Лучший ответ
var bigArray = [];

function addingToBigArray(elem) {
  var element = elem;
  for (var i = 0; i < element.length; i++) {
    bigArray[bigArray.length] = {
      [elemMag[i]]: element.offsetHeight
    }
  }
}

См. []

2
Isaac 15 Мар 2018 в 02:54