码迷,mamicode.com
首页 > Web开发 > 详细

js楼层 类似与天猫的京东

时间:2015-07-08 18:39:07      阅读:478      评论:0      收藏:0      [点我收藏+]

标签:

// JavaScript Document
$(window).scroll(function(){
	// this code if the fix nav
	var fixnav =$(‘.boholo_fix_nav‘).offset().top;
    var hideheght=$(‘.block‘).offset().top;
	var trss=$(‘#item4‘).offset().top;
	var nav=$(".boholo_fix_nav"); 
	var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop); 
	if(scrollTop < 623){//其实呢,623就是fixnav距离顶部的高度
					  nav.removeClass("fixednav");
					 };
   if(scrollTop>fixnav && scrollTop< hideheght){
		  nav.addClass("fixednav");
		  };
	if(scrollTop > trss){
		 nav.removeClass("fixednav");
		};

// this code if the fix nav	is a slight
	 var items = $(".boholo_fix_nav_body").find(".item");
	 var menu = $(".boholo_fix_nav");
	// var top = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
	 var currentId = ""; //滚动条现在所在位置的item id
	 items.each(function () {
		 		
				//var m=$(‘.boholo_fix_nav_body‘).children(‘.item‘).offset().top;	
					
                   var m = $(this);
				  //var m =$(‘.item‘);
                    //注意:m.offset().top代表每一个item的顶部位置
                    if (scrollTop > m.offset().top - 200) {
                        currentId = "#" + m.attr("id");
                    } else {
                        return false;
                    }
                });
	
	   var currentLink = menu.find(".current");
                if (currentId && currentLink.attr("href") != currentId) {
                    currentLink.removeClass("current");
                    menu.find("[href=" + currentId + "]").addClass("current");
                }
	
	
	});

  技术分享

js楼层 类似与天猫的京东

标签:

原文地址:http://www.cnblogs.com/oksite/p/4630603.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!