tab切换点击居中处置惩罚

道理

1.猎取当前对象及当前对象的一切对象的高度和，猎取当前父盒子的高度
2.运用jquery的animate动画处置惩罚

css款式

*{margin:0;padding:0;}
.parent{list-style-type:none;height:300px;width:120px;overflow-y:scroll;}
.child{height:38px;border-top:2px solid red;background: green;line-height: 38px;}

html代码段

• 阿里巴巴


• 腾讯


• 百度


• 华为


• 遐想


• 万科


• 万达


• 恒大


• 小米


• 京东


• 格力


• 美的


• 海尔

Javascript代码段

var
parentNode = $( '.parent' ),
childHeight = 40,
parentNodeHeight = 300;
$('.child').click(function(){
var j = $(this).index();
parentNode.stop().animate({
scrollTop : childHeight * ( j + 1 ) - parentNodeHeight / 2 // 中心代码
},600);
});


url参数猎取

const getUrlParam = function ( mid, hashOn=false ) {
const reg = new RegExp("(^|&)" + mid + "=([^&]*)(&|$)");
const util = idx => window.location[ idx ].substr(1).match(reg);
const r = util('search') || ( hashOn && util( 'hash' ) ) || null;
if ( r != null )
return decodeURIComponent( r[2] );
return null;
}