jquery可以通过选择器选择一类的标签集合。然后通过$（this）指向当前对象。

 

　　$（"#ul li"）这个可以获取id为ul下的所有的li 当鼠标经过某个li是使用$（this）表示当前的li对象在进行操作。

 

　　每个li都添加mouseover可以理解为 每个li都触发mouseover事件。

 

　　例如：

 

　　123

 

　　$（"#ul li"）。mouseover（function（）{//jquery的mouseover事件

 

　　alert（$（this）。index（））;//弹出每个li的的位置

 

　　//这样就能实现每个li都绑定mouseover事件

 

　　}）;

 

　　这应该是简单的滑动门效果。

 

　　HTML的结构估计就是你这样了，左边是列表，右边是div组。

 

　　其实，你只要明白，左边的列表和右边的div组都是有索引值（index）的。然后通过一个变量来控制就可以了，这样这个变量即可以给左边的列表用，也可以给右边的按钮用。var int=0; //初始化一个变量

 

　　//定义一个函数，用来隐藏显示右侧的div和控制左侧的列表

 

　　function divShow（int）{

 

　　$（'#right .item'）。hide（）。eq（int）。show（）;

 

　　$（'#left li'）。removeClass（'current'）。eq（int）。addClass（'current'）;

 

　　}

 

　　我们需要给左侧的列表添加事件；$（'#left li'）。bind（{

 

　　'mouseover' : function（）{

 

　　//获取当前元素的索引值

 

　　int=$（this）。index（）;

 

　　//执行函数，这里会显示右侧的第一个div元素

 

　　divShow（int）;

 

　　},

 

　　'mouseout' : function（）{

 

　　//鼠标划开时的操作

 

　　//int=0;

 

　　//divShow（int）;

 

　　}

 

　　}）;

 

　　侧边的按钮也是一样//上翻

 

　　$（'#prev'）。bind（{

 

　　'click' : function（）{

 

　　//这里要使用判断

 

　　if（int <=0）{

 

　　//这里的个数可以拿到外面定义；

 

　　int=（$（'#right .item'）。length-1）;

 

　　}else{

 

　　int=（int-1）;

 

　　};

 

　　int=int;

 

　　}

 

　　}）;

 

　　//下翻

 

　　$（'#next'）。bind（{

 

　　'click' : function（）{

 

　　//这里要使用判断

 

　　if（int >=（$（'#right .item'）。length-1））{

 

　　//这里的个数可以拿到外面定义；

 

　　int=0;

 

　　}else{

 

　　int=（int+1）;

 

　　};

 

　　int=int;

 

　　}

 

　　}）;