封装的jquery翻页滚动（示例代码）

HTML结构:
复制代码代码如下:
ul._rollSe{width:100px;height:300px;over-flow:hidden}
ul._rollSe li._rollPar{height:100px;border:1px solid #369}

复制代码代码如下:
<div class="_rollParent">
<ul class="_rollPageSe">
  <li class="_rollpage">1</li>
  <li class="_rollpage">2</li>
</ul>
<div>
  <a href="#" mce_href="#" class="_scrollPrev" data-frequency="3" data-pr="happy">上一页</a>
  <a href="#" mce_href="#" class="_scrollNext" data-frequency="3" data-pr="happy">下一页</a>
</div>
<ul class="_rollSe">
  <？php for（$a=1;$a++;$a<10）:？>
  <li class="_rollPar"><？php echo $a; ？></li>
  <？php endfor;？>
</ul>
</div>

JS引入文件:

author : teresa 2011-3-28

params: 以上HTML结构必填项: 有关的class

_rollParent: 触发事件的上级层）

_rollSe :滚动区域

_rollPar: 滚动元素

_scrollNext: 下一页按钮

_scrollPrev: 上一页按钮

_rollPageSe : 分页区域

_rollpage：页码元素

data-frequency: 滚动频率（eg:一次滚动3个元素） ->需标注在触发事件的按钮上.

data-pr: cookie的前缀.

discription: 一次性读取几条数据, 只显示几条, 滚动翻页（一次性滚3条或n条） ; 此方法只需在所需事件滚动效果的html元素标注以上规定class便可使用.

JS初始化方法:
复制代码代码如下:
/**************************************************************************
discription: 翻页滚动
***************************************************************************/
//插件引入
document.write（"<mce:script type="text/javascript" src="/js/jquery//scrollTo/jquery.scrollTo-min.js" mce_src="js/jquery//scrollTo/jquery.scrollTo-min.js"></mce:script>"）;
//函数初始化
$（function（）{
/*
  author: teresa 2011-03-24 14:32:42
  discription: strollTo init
*/
//滚动初始显示
_scroll.init（）;
//上滚
$（"._scrollPrev"）.live（"click",function（）{
  _scroll.prev（this）;
  return false;
}）;
//下滚
$（"._scrollNext"）.live（"click",function（）{
  _scroll.next（this）;
  return false;
}）;
}）;
/*
author: teresa
update_time: 2011-03-24 14:52:34
discription: 分页滚动
*/
var _scroll = {
//滚动cookie
config:{
  ckname : "lifedu_rollCur",
  ckoptions : {
   expires : 3, // in days
   path : "/"
  }
},

//初始化
init:function（）{
  var roll = $（"._rollParent"）;
  for （i=0;i<roll.length ;i++ ）
  {
   var cookieName = roll.eq（i）.find（"._scrollNext"）.attr（"data-pr"）+"_lifedu_rollCur";
   var oStr = $.cookie（_scroll.config.ckname） || "{}";
   var json = eval（"（"+oStr+"）"）;
   var cur = 0;
   var page = 0;
   var rollPar = roll.eq（i）.find（"._rollPar"）;
   roll.eq（i）.find（"._scrollPrev"）.addClass（"disabled"）;
   roll.eq（i）.find（"._rollSe"）.scrollTo（rollPar.eq（cur）,50）;
   roll.eq（i）.find（"._rollPageSe"）.find（"_rollpage"）.removeClass（"ac"）.eq（page）.addClass（"ac"）;
   //cookie
    json.cur = cur;
    json.page = page;
   var data = JsonToStr（json）;
   $.cookie（cookieName,data,_scroll.config.ckoptions）;
  }
},

_p : {},
//预处理
_pre:function（o）{
  _scroll.config.ckname = $（o）.attr（"data-pr"） +"_lifedu_rollCur";
  _scroll._p.rollFrequency = parseInt（$（o）.attr（"data-frequency"））;
  _scroll._p.rollSe = $（o）.parents（"._rollParent"）.find（"._rollSe"）;   //滚动区域
  _scroll._p.rollPar = _scroll._p.rollSe.find（"._rollPar"）;
  _scroll._p.rlen = _scroll._p.rollPar.length;
  //页码区域
  _scroll._p.rollPageSe = $（o）.parents（"._rollParent"）.find（"._rollPageSe"）;
  _scroll._p.rollPageLen = _scroll._p.rollPageSe.find（"._rollpage"）.length;
},

//下滚
next:function（o）{
  _scroll._pre（o）;
  var oStr = $.cookie（_scroll.config.ckname） || "{}";
  var json = eval（"（"+oStr+"）"）;
  var last = _scroll._p.rlen - 1;
  var n = _scroll._p.rollFrequency;
  var cur = parseInt（json.cur） || 0 ; //当前滚动元素索引
  var page = parseInt（json.page） || 0 ; //当前页码
  if（cur+n < last）{
   cur += n;
   page++;
  }else if（cur == last）{
   return;
  }else{
   cur = last;
   page = _scroll._p.rollPageLen - 1;
  }
  //if last page addClass "disabled";
  $（o）.parents（"._rollParent"）.find（"._scrollPrev"）.removeClass（"disabled"）;
  if（page == _scroll._p.rollPageLen - 1） {
   $（o）.addClass（"disabled"）;
  }else {
   $（o）.removeClass（"disabled"）;
  }
  //scroll
  _scroll._p.rollSe.scrollTo（_scroll._p.rollPar.eq（cur）,500）;
  _scroll.goPage（page）;
   //写入cookie
   json.cur = cur;
   json.page = page;
  var data = JsonToStr（json）;
  $.cookie（_scroll.config.ckname,data,_scroll.config.ckoptions）;
},

//上滚
prev:function（o）{
  //lg（"prev"）;
  _scroll._pre（o）;
  var oStr = $.cookie（_scroll.config.ckname） || "{}";
  var json = eval（"（"+oStr+"）"）;
  var cur = parseInt（json.cur） || 0 ; //当前滚动元素索引
  var page = parseInt（json.page） || 0 ; //当前页码
  var n = _scroll._p.rollFrequency;

  if（cur-n > 0）{
   if（cur == _scroll._p.rlen - 1）{
    cur -= 2*n-1;
   }else {
    cur -= n;
   }
   if（cur < 0）{cur = 0;}
   page--;

  }else if（cur == 0）{
   return;
  }else {
   cur = 0;
   page = 0;
  }
  //if first page addClass "disabled";
  $（o）.parents（"._rollParent"）.find（"._scrollNext"）.removeClass（"disabled"）;
  if（page == 0） {
   $（o）.addClass（"disabled"）;
  } else {
   $（o）.removeClass（"disabled"）;
  }
  //scroll
  _scroll._p.rollSe.scrollTo（_scroll._p.rollPar.eq（cur）,500）;
  _scroll.goPage（page）;
  //写入cookie
   json.cur = cur;
   json.page = page;
  var data = JsonToStr（json）;
  $.cookie（_scroll.config.ckname,data,_scroll.config.ckoptions）;
},
goPage : function（p）{
  //lg（p）;
  if（_scroll._p.rollPageSe.length ！= 0）{
   _scroll._p.rollPageSe.find（"._rollpage"）.removeClass（"ac"）.eq（p）.addClass（"ac"）;
  }
}
}