百右侧导航滚动代码

function DirectoryNav($h,config){

thisopts = $extend(true,{

scrollThreshold:05,    //滚动检测阀值 05在浏览器窗口中间部位

scrollSpeed:700,        //滚动到指定位置的动画时间

scrollTopBorder:500,    //滚动条距离顶部多少的时候显示导航，如果为0，则一直显示

easing: 'swing',        //不解释

delayDetection:200,     //延时检测，避免滚动的时候检测过于频繁

scrollChange:function(){}

},config);

this$win = $(window);

this$h = $h;

this$pageNavList = "";

this$pageNavListLis ="";

this$curTag = "";

this$pageNavListLiH = "";

thisoffArr = [];

thiscurIndex = 0;

thisscrollIng = false;

thisinit();

}

DirectoryNavprototype = {

init:function(){

thismake();

thissetArr();

thisbindEvent();

},

make:function(){

//生成导航目录结构,这是根据需求自己生成的。如果你直接在页面中输出一个结构那也挺好不用 搞js

$("body")append('<div class="directory-nav" id="directoryNav"><ul></ul><span class="cur-tag"></span><span class="c-top"></span><span class="c-bottom"></span><span class="line"></span></div>>');

var $hs = this$h,

$directoryNav = $("#directoryNav"),

temp = [],

index1 = 0,

index2 = 0;

$hseach(function(index){

var $this = $(this),

text = $thistext();

if(thistagNametoLowerCase()=='h2'){

index1++;

if(index1%2==0) index2 = 0;

temppush('<li class="l1"><span class="c-dot"></span>'+index1+' <a class="l1-text">'+text+'</a></li>');

}else{

index2++;

temppush('<li class="l2">'+index1+''+index2+' <a class="l2-text">'+text+'</a></li>');

}

});

$directoryNavfind("ul")html(tempjoin(""));

//设置变量

this$pageNavList = $directoryNav;

this$pageNavListLis = this$pageNavListfind("li");

this$curTag = this$pageNavListfind("cur-tag");

this$pageNavListLiH = this$pageNavListLiseq(0)height();

if(!thisoptsscrollTopBorder){

this$pageNavListshow();

}

},

setArr:function(){

var This = this;

this$heach(function(){

var $this = $(this),

offT = Mathround($thisoffset()top);

ThisoffArrpush(offT);

});

},

posTag:function(top){

this$curTagcss({top:top+'px'});

},

ifPos:function(st){

var offArr = thisoffArr;

//consolelog(st);

var windowHeight = Mathround(this$winheight() thisoptsscrollThreshold);

for(var i=0;i<offArrlength;i++){

if((offArr[i] - windowHeight) < st) {

var $curLi = this$pageNavListLiseq(i),

tagTop = $curLiposition()top;

$curLiaddClass("cur")siblings("li")removeClass("cur");

thiscurIndex = i;

thisposTag(tagTop+this$pageNavListLiH05);

//thiscurIndex = this$pageNavListLisfilter("cur")index();

thisoptsscrollChangecall(this);

}

}

},

bindEvent:function(){

var This = this,

show = false,

timer = 0;

this$winon("scroll",function(){

var $this = $(this);

clearTimeout(timer);

timer = setTimeout(function(){

ThisscrollIng = true;

if($thisscrollTop()>ThisoptsscrollTopBorder){

if(!This$pageNavListLiH) This$pageNavListLiH = This$pageNavListLiseq(0)height();

if(!show){

This$pageNavListfadeIn();

show = true;

}

ThisifPos( $(this)scrollTop() );

}else{

if(show){

This$pageNavListfadeOut();

show = false;

}

}

},ThisoptsdelayDetection);

});

this$pageNavListon("click","li",function(){

var $this = $(this),

index = $thisindex();

ThisscrollTo(ThisoffArr[index]);

})

},

scrollTo: function(offset,callback) {

var This = this;

$('html,body')animate({

scrollTop: offset

}, thisoptsscrollSpeed, thisoptseasing, function(){

ThisscrollIng = false;

//修正弹两次回调 蛋疼

callback && thistagNametoLowerCase()=='body' && callback();

});

}

};

//实例化

var directoryNav = new DirectoryNav($("h2,h3"),{

scrollTopBorder:0   //滚动条距离顶部多少的时候显示导航，如果为0，则一直显示

});