伴随着html5和css3的成熟，页面展现的越来越绚丽越吸引人，尤其体现在各大网站的专题活动上。
现在写了一个简略的框框。
实现思想：
当滚动条滚动时，滚动到底部切换到下一屏，滚动到顶部时切换到上一屏。
点击按钮时滚动到对应的屏。
代码简略：
1、滚动条滚动方向，-1向下，1向上，注意：如用ie，请用ie9以上的浏览器看效果。
document.addEventListener(mousewheel,function(e){ e = e || window.event; if(!isFirefox){ direct = e.wheelDelta>0?-1:1; } else{ direct = e.detail<0?-1:1; } },false);
2、滚动到那一屏
$(document).scroll(function(){ rollH = $(this).scrollTop(); if(islock){ if((rollH===docH-winH) && (direct === 1 )){ num++; if(num>5){ num = 5; return; } if(!((num===5)||(num===0))){ islock = false; } running(num); } else if((rollH ===0)&&(direct === -1)){ num--; if(num<0){ num = 0; return; } if(!((num===5)||(num===0))){ islock = false; } running(num); } } });
3、切换滚动，在切换那一时刻，将滚动条隐藏，结束后再显示。除了第一屏外，其他的屏都是距离顶端有1px距离。
var islock = true; test.animate({"left":"0px","top":"0px"},500,function(){ $(document).scrollTop(0); setTimeout(function(){ islock=true; $(document).scrollTop(1); $("body").removeClass("bodyon"); },500); });
题来了：
当滚动条滚动时，蓝色块会抖动，尤其在ie9和chrome下比较明显。
感兴趣的朋友可以试试写写哈O(∩_∩)O