jQueryでスクロールバーの初期位置を変更する

ホームページ内でスクロールバーを使用する場合、特に設定がなければ左上を基準に表示されますが、デザインの都合で初期位置を変更する必要があったため、対応方法をメモ

HTML

<div class="scroll__flame">任意のコンテンツ</div>

CSS

.scroll__flame {
	width: 90vw;
	margin: 0 auto;
	overflow: auto;
}

jQuery（javascript）

$(document).ready(function() {	
	var $elm = $('.scroll__flame');
	if($elm.length){
		var halfScrollWidth = $elm[0].scrollWidth / 2; 
		$elm.scrollLeft(halfScrollWidth);
	}
});

参考例はスクロールバーの水平位置が最大表示横幅（90VW）の半分の位置で表示されるように設定

垂直位置を調整する場合は下記。
最大表示縦幅を利用します。

CSS

.scroll__flame {
	height: 90vh;
	overflow: auto;
}

jQuery（javascript）

$(document).ready(function() {	
	var $elm = $('.scroll__flame');
	if($elm.length){
		var halfScrollHeight = $elm[0].scrollHeight / 2; 
		$elm.scrollTop(halfScrollHeight);
	}
});