Саша

keysoft.themetek.com/demo1/js/particles.js
https://github.com/VincentGarreau/particles.js

Используя jquery

$('.cityjs').click(function(){
  alert($(this).text());
});

Ссылка на себя - это реклама. Реклама это привлечение дополнительного дохода. А привлечение дохода стоит денег. По этому ссылка входит в стоимость разработки.

Условно говоря, сайт создать стоит 10 000 рублей. Ставим ссылку. Которая возможно принесёт ещё заказы, так же вешаем сайт в своё портфолио, что тоже принесёт заказы.
Если клиент не хочет ссылку, то добавляем в стоимость 10-20% от базовой цены. Тогда уже сайт без ссылки будет стоить 12 000р. Сайт, который заказчик захочет не светить в твоём портфолио, тоже стоит дороже, на те же самые 10-20%. То есть сайт без ссылки и не показанный в портфолио, уже стоит 14 000р. Потому что ты, недополучишь прибыли, которую ты закладываешь в цену разработки с учётом своей рекламы (ссылка + портфолио).

Все крупные веб студии это отдельно оговаривают в договорах. Что ссылка там обязана быть и в портфолио они имеет право размещать. И клиент, по договору. без согласия студии, не имеет права удалять ссылку. За удаление он обязан заплатить.

function clickOutside (el) {
	$(document).on('click', function(event) {
		event.stopPropagation();
		if ($(event.target).is(el)) return;

		console.log('Клик мимо меня');
	});
}

upd:

function clickOutside (selector) {
	document.addEventListener('click', function (event) {
		event.stopPropagation();
		var el = document.querySelector(selector);
		if (event.target === el) return;

		console.log('Не попал =)');
	});
}

upd:

function findParentBySelector(elm, selector) {
    var all = document.querySelectorAll(selector);
    var cur = elm.parentNode;
    while(cur && !collectionHas(all, cur)) {
        cur = cur.parentNode;
    }
    return cur;
}

function clickOutside (selector) {
	document.addEventListener('click', function (event) {
		event.stopPropagation();
		var el = document.querySelector(selector);
		if (event.target == el) return;

    // Проверка на то что это дочерний элемент
    if (event.target == findParentBySelector(selector)) return;

		console.log('Не попал =)');
	});
}

history.pushState("", document.title, window.location.pathname);

$('input').on('change', function(){
  $('.btn-warning').html('hello world')
})

jsfiddle.net/mv68hdo3/4

UPD: ой, вам же имя файла нужно:
jsfiddle.net/mv68hdo3/5

nasledie.marmax.ru/selection
Как раз делаю сейчас проект.
Это map area. Подробнее.

1. Записываете значение в эталонной валюте в data-атрибут.
2. При переключении на другую валюту высчитывает коэффициент умножения.
3. Ввыводите пересчитанное значение.

Примерно так:

<span class="price" data-default-currency-value="100">100 USD</span>
<span class="price" data-default-currency-value="500">500 USD</span>
<button class="recalculate" data-currency="EUR">Recalculate in EUR</button>
<button class="recalculate" data-currency="RUB">Recalculate in RUB</button>

var currencyCoefficients = {
    EUR: 1.1,
    RUB: 65
};


$('.recalculate').on('click', function() {     
    var currency = $(this).data('currency');
    
    $('.price').each(function() { 
        var value = $(this).data('default-currency-value');
        var recalculatedValue = Math.ceil(value*currencyCoefficients[currency]);
        
        $(this).html(recalculatedValue + ' ' + currency);
    });
});

Пример: jsfiddle.net/2tpsshu3

Только недавно сталкивался с этой же проблемой, решил переписав css свойства скролла для webkit:

.scroll_block::-webkit-scrollbar-thumb {
    border: 2px solid white;
    background-color: #ccc;
}
.scroll_block::-webkit-scrollbar {
    -webkit-appearance: none;
}

.scroll_block::-webkit-scrollbar:horizontal {
    height: 13px;
}

.scroll_block::-webkit-scrollbar-thumb {
    border-radius: 6px;
    border: 2px solid white; 
    background-color: rgba(0, 0, 0, .5);
}

p.s. цвет и т.п. сами устанавливайте

Как-то так codepen.io/anon/pen/epwGoW

Во-первых, реализация тут будет несколько отличаться в зависимости от верстки, а конкретно, если наш внешний блок имеет position == absolute || relative || fixed то задаем нашему листу position: absolute и работаем с его свойством top, в ином случае придется работать с свойством margin-top, что медленнее в отрисовке.

Собственно по реализации:
я допущу, что у Вас уже сохранен jQuery объект списка в переменной $list, что работаем мы все таки со свойством top и у Вас уже где-то есть таймер в котором это свойство top уменьшается, вот туда нужно будет добавить следующий код:

var $li = $list.find('li:eq(0)');
var h = $li.height();
var top = +$list.css('top');
if(top < -2 * h) { //если список поднялся больше чем на 2 высоты 1 элемента
    $li.remove().appendTo($list); //перемещаем элемент в конец списка
    $list.css('top', (top + h) + 'px'); //опускаем список на высоту элемента,
                         //так как мы его убрали вначале
}