0

Вот пример кода

let container1 = document.getElementById('container1');
console.log(container1);
function Slider(container){

  this.container = container;



}


Slider.prototype.setSlider = function () {
console.log(this.container + ' what')
    let ul = this.container.querySelector('.ul');
let li = ul.getElementsByTagName('li');
    if (counter < li.length - 1) {
        position = position + 300;
        counter++;
    } else {
        counter = 0;
        position = 0;
    }
    ul.style.marginLeft = -position + 'px';


}


let firstSlider = new Slider(container1);


setInterval(firstSlider.setSlider, 2000);
#container1 {
  width: 300px;
  overflow: hidden; }
  .container2 {
  width: 300px;
  overflow: hidden; }

.ul {
  width: 9999px;
  margin-left: 0; }

li {
  display: inline-block; }

img {
  width: 288px; }
<div id="container1">
    <ul class="ul" >
        <li> <img src='https://safebrowsing.google.com/images/puzzle.svg' /></li>
        <li><img src='https://mobilenet.cz/obrazek/ikonka-204235/620w' /></li>
        <li><img src='https://upload.wikimedia.org/wikipedia/commons/e/e9/Google_Calendar.png' /></li>
        <li><img src='https://lh4.ggpht.com/2PnWIlqNE5ZHwTpNdRBhViSOVBzRIeR4ezAisGyjrqWPiyRcSkm9RCpRBYg7lLvrMA=w300'/></li>
    </ul>
</div>
<div class="container2">
    <ul class="ul">
        <li> <img src='https://safebrowsing.google.com/images/puzzle.svg' /></li>
        <li><img src='https://mobilenet.cz/obrazek/ikonka-204235/620w' /></li>
        <li><img src='https://upload.wikimedia.org/wikipedia/commons/e/e9/Google_Calendar.png' /></li>
        <li><img src='https://lh4.ggpht.com/2PnWIlqNE5ZHwTpNdRBhViSOVBzRIeR4ezAisGyjrqWPiyRcSkm9RCpRBYg7lLvrMA=w300'/></li>
    </ul>
</div>

https://jsfiddle.net/Smefinka/unvcc5cm/

То есть, почему то не могу достучаться к переменной через this. Пишут undefined, когда вызываю без интервала всё нормально.

let firstSlider = new Slider(container1);
setInterval(firstSlider.setSlider, 2000);
MSDN.WhiteKnight
  • 20,179
Лина
  • 187
  • нашла решения если вызвать через другую функцию – Лина Jan 14 '18 at 20:26
  • 1
    несмотря на то что вопрос на котоырй я сослался выше может показаться вам не очень похожим, крайне рекомендую его прочитать и разобраться, причина ошибки именно в этом. – Утка Учится Укрываться Jan 14 '18 at 21:54
  • спасибо, так же полезно. – Лина Jan 14 '18 at 22:07

1 Answers1

1
setInterval(firstSlider.setSlider.bind(firstSlider), 2000);

или

setInterval(function() { firstSlider.setSlider(); }, 2000);

Добавьте

var counter = 0;
var position = 0;