Tweet

Pocket

スマホなどでタブ切り替えがあった場合に、タブ自体を横スクロールで表示させたりする。
そういう場合にページが読み込まれた際にアクティブなタブ要素が画面中央に表示されるようにする方法です。

var sideScroll = $('.box .chirdren.active').offset();
var windowWidth = $(window).width();
var activeWidth = $('.box .chirdren.active').innerWidth();

$('.box').scrollLeft(sideScroll.left - (windowWidth / 2) + (activeWidth / 2));