Полоса прокрутки над контентом

По умолчанию, overflow-x:scroll добавляет скролл в нижней части блока, в котором требуется прокрутка. Что не всегда удобно.

Под катом простенький jQuery скрипт, который позволит добавить дублирующий скроллбар сверху блока.

if($('.h_scroll').length > 0) {
	$.each($('.h_scroll'), function(key, h_scroll) {
		var wdth = $(h_scroll).find('.h_scroll_content').width();
		if(wdth>960) {
			var b_scroll = $('<div style="overflow-x:scroll;width:960px"/>');
			var b_cont = $('<div style="height:1px"></div>').width(wdth);
			b_scroll.append(b_cont);
			b_scroll.scroll(function(){
				$(h_scroll).scrollLeft(b_scroll.scrollLeft());
			});
			$(h_scroll).before(b_scroll);
			$(h_scroll).scroll(function(){
				b_scroll.scrollLeft($(h_scroll).scrollLeft());
			});
		}
	});
}

Где .h_scroll - класс блока со скроллом; .h_scroll_content - блок, который определяет размер контента.

Пример разметки:

<div class="h_scroll">
	<div class="h_scroll_content"> .... широкий контент ... </div>
</div>