Доброго времени суток всем. Я верстальщик и захотелось мне написать плагин для собственных нужд, чтобы быть в нем на все 100% уверенным быть и JS заодно подкачать. Хочу сделать все на data атрибутах и опциях, передаваемых с ними. Прохожу по всем элементам 1 раз при инициализации, создаю объект для каждого sticky элемента, туда записываю опции, присваиваю объект в массив values, а при вызове метода render он проходит уже по массиву values. Проблема в том, что в методе render при выводе values в нем сохраняется только последний объект. В JS я + - 0, так что любые советы по организации кода тоже приветствуются. Заранее спасибо. Код | var Sticky = function(values) { var mainOffset = 0;
Sticky.prototype.detach = function () {
};
Sticky.prototype.destroy = function () {
};
Sticky.prototype.render = function () { var bodyScrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
console.log(values); for (var key in values) { console.log( "Ключ: " + key + " значение: " + values[key] );
// if (bodyScrollTop > values[key].stickyOffsetTop) { // console.log("свсвс"); // } }
};
};
function stickyInit(){ var stickyArr = document.querySelectorAll('[data-sticky]'); var stickysLenght = stickyArr.length; var values = []; console.log('xzxzxz'); for (var i = 0; i < stickysLenght; i++) { var stickyItem = stickyArr[i];
// var placeholder = sticky.parentNode; // $(sticky).wrap("<div class='sticky-placeholder'></div>");
var stickyEl = new Sticky({ stickInParent: $(stickyItem).data("sticky").stickInParent, stickyOffsetTop : stickyItem.offsetTop });
values.push(stickyEl);
}
window.addEventListener('scroll', function(e) { stickyEl.render(); });
return values; }
|
|