Выделить интервал элементов (от a до b) двумя кликами

[Teamur]

Может сделать своеобразный счетчик кликов мышью?
А получение номера элемента выполнять ПРЕДВАРИТЕЛЬНО, еще ДО кликов.
Первый клик - присваиваем переменной a номер, полученный предварительно при наведении.
Далее следуя за курсором, подсвечиваем элементы от a до текущего элемента, над которым находится курсор, постоянно обновляя переменную b
Слова словами, но я уверен, что оптимальное решение задачи займет строк 15-20.

А здесь нечто похожее, но реализованное на CSS:
https://jsfiddle.net/hma21mxm/
Но хотелось бы обойтись без input-ов, label-ов.
Только div-ы.
Все, что я могу на данный момент - предлагать хоть что-то, имеющее отношение к теме.

[DynkanMaclaud]

Teamur,
https://jsfiddle.net/daniilKhanin/r48q2o6e/1/
да уж... когда начинал писать не думал что такой ГО...код получится)))))

[рони]

DynkanMaclaud,
сложно вернуть синий фон за курсором, осообенно если блоки в 2 ряда.

[destus]

что - то этого не наблюдаю

Да вроде есть

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

[Teamur]

destus,
Верно.

DynkanMaclaud,
синяя область должна следовать за курсором пока вы не совершите второй клик, но в пределах контейнера. Другими словами, если увести курсор со второго ряда на первый, то синька со второго ряда пропадет, а будет уже на первом ряду у курсора, естественно при этом цепь синих элементов не должна нигде прерываться.

[DynkanMaclaud]

рони,
Teamur, исправил https://jsfiddle.net/daniilKhanin/r48q2o6e/3/

[DynkanMaclaud]

Эххх вот если бы рони,
показал бы свой пример, где я уверен код был бы не таким ужасным...

[рони]

показал бы свой пример

я уже показывал выше, если вы не смотрели ...

рони,
Teamur, исправил

ок

[Teamur]

DynkanMaclaud, спасибо
Практически как надо.
Осталось это:
Первый клик -> Отводим курсор -> Выводим за контейнер ->

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

[DynkanMaclaud]

Teamur,
не понял я что-то, тоесть события mouseover вообще не должно быть? или синяя область должна только быть на том элементе на который наведен курсор?