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

Question

[Александр Тимофеев]

Нужно чтобы при клике по .arrow-next-timeline каждый раз прибавлялось какое-либо значение к параметру left у .overflow-timeline>div

Написал что-то такое, но что-то не то...

$('.arrow-next-timeline').on('click', function(){
    var i = $('.overflow-timeline>div').css('left');
    i += 100;
    $('.overflow-timeline>div').css('left', i + 'px'); 
});

Тут упрощённый пример (работающий): jsfiddle.net/timofeev/tgb7bb7g/2
А тут попытка сделать то, что выше написано: jsfiddle.net/timofeev/tgb7bb7g/3

Comments

[Yaroslav Lyzlov]

Ваша формулировка непонятна.

[Александр Тимофеев]

Yaroslav Lyzlov: пояснил в описании

Answer 1

[Денис Инешин]

var left = 0;

$('.first').on('click', function () {
    left++;
    $('.second')[0].style.left = left + 'px';
});

Comments

[Александр Тимофеев]

Заработало, спасибо!
Но не могу осмыслить последнюю строку. Для чего там хотя бы [0]? Вроде это первый элемент массива, но не уловлю зачем это тут?

[Денис Инешин]

Александр Тимофеев: $('.second') - это jQuery коллекция элементов. Т.е. всегда массив. Можно конечно записать проще, например так: $('.second').css('left', left + 'px'); но так будет чуть тяжелее работать, чем на чистом JS через Style.

[Александр Тимофеев]

Денис Инешин: ясно :)

Answer 2

[Юрий]

Вот так попробуйте

var i = parseInt($('.overflow-timeline>div').css('left'));