Как исправить скрипт горизонтального скроллинга?

Question

[mxbeat]

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

Демо: https://codepen.io/maxbeat/pen/LEPXjoo

Код:

$('.scroll-container').mousedown(function (e) {
		$(this)
			.data('down', true)
			.data('x', e.clientX)
			.data('scrollLeft', this.scrollLeft)
		return false; // предотвращаем стандартное поведение
	}).mousemove(function (e) {
		if ($(this).data('down') == true) {
			this.scrollLeft = $(this).data('scrollLeft') + $(this).data('x') - e.clientX;
			$(this).addClass('dragging');
		}
	}).mouseup(function (e) {
		$(this)
			.data('down', false)
			.removeClass('dragging');
	});
	// если мышка соскакивает с блока, чтобы не залипала потом на нем
	$(document).mouseup(function (e) {
		$('.scroll-container')
		.data('down', false)
		.removeClass('dragging');
	});

Answer 1

[Виталий Першин]

Отлавливать, что клик произошел, по селекту, а дальше уже определять поведение. Самое простое, это обернуть код в условие:

if(e.target.nodeName != "SELECT") {
		$(this)
			.data('down', true)
			.data('x', e.clientX)
			.data('scrollLeft', this.scrollLeft)
		return false; // предотвращаем стандартное поведение
   }