1.事件委托
$(function(){
/*
给每个li绑定事件，一共绑定了8次，性能不高
$('.list li').click(function() {
alert($(this).html());
});
*/
/*
事件委托：方法delegate，只绑定一次事件，冒泡触发
参数：
selector选择器：写入ul下面的所有要发生事件的元素，多个元素用空格隔开，例如‘li a span’
eventType事件
function要执行的操作
$('.list').delegate('li', 'click', function() {
//$(this)指发生事件的子集，即每个li
alert($(this).html());
//全部取消委托
$('.list').undelegate();
});
})
2.整屏滚动
$(function(){
var $h = $(window).height();//获取浏览器页面默认高度
var len = $('.pages').length;
var $points = $('.points li');//选上滚动点并赋值给变量
var $pages = $('.pages');
var nowscreen = 0;
var timer = null; //设定一个定时器，消除用力滚动滑轮划多屏的效果
$pages.eq(0).addClass('moving');
$('.pages').css({height:$h});//把滚动页面的高度设为页面默认高度
//mousewheel插件设定dat的值：-1是向下滑动，1是向上滑动，
$(window).mousewheel(function(event,dat){
//清掉前面刚刚开的定时器：在200毫秒之内如果多次滚动，前面的都会清掉，只保留最后一个滚动
clearTimeout(timer);
// 最新的一次定时器，200毫秒内的最后一个滚动才会触发下面的事件，setInterval是反复执行，setTimeout执行一次
timer = setTimeout(function(){
if(dat==-1)
{
nowscreen++;
//本例只有5屏，所以nowscreen区间为0-4，nowscreen自加大于4时，赋值为4，不再往下滑
if(nowscreen>len-1){
nowscreen=len-1;
}
}
else
{
nowscreen--;
if(nowscreen<0){
nowscreen=0;
}
}
//向上滚屏时为负数，也就是-$h*nowscreen，300毫秒是延迟滚动，增强视觉体验
$('.pages_con').animate({top:-$h*nowscreen},300);
//这里表示当选上某屏时，就把li加上active属性，并且同时去掉其他li的acive属性
$points.eq(nowscreen).addClass('active').siblings().removeClass('active');
//给每一屏加动画效果，200毫秒是定时器的设定
$pages.eq(nowscreen).addClass('moving').siblings().removeClass('moving');
},200);
})
//实现点击页面右边的列表点也能到相应页面屏的效果
$points.click(function(){
//实现跳到指定屏
$(this).addClass('active').siblings().removeClass('active');
$('.pages_con').animate({top:-$h*$(this).index()},300);
//指定屏加动画
$pages.eq($(this).index()).addClass('moving').siblings().removeClass('moving');
})
})