用是jQuery实现一个纵向的图片滚动,点击上下箭头为什么就是不换页呢,高手们帮忙看一下

所有代码如下:<scripttype="text/javascript"src="jquery.js"></script><scripttype="text/javasc... 所有代码如下:
<script type="text/javascript" src="jquery.js"></script><script type="text/javascript">$(function() { var page = 1; var i = 4; $("#prev a").click(function() { var $parent = $(this).parents().find("div#ibody"); var $img = $parent.find("div#img"); var img_height = $img.height(); var $new = $img.find("div#new"); //alert(img_height); var li_lenth = $img.find("li").length; //alert(li_lenth); var page_count = Math.ceil(li_lenth / i); //alert(page_count); if( !$img.is(":animated") ){ //判断“视频内容展示区域”是否正在处于动画 if( page == page_count ){ //已经到最后一个版面了,如果再向后，必须跳转到第一个版面。 $img.animate({ top : '0px'}, "slow"); //通过改变left值，跳转到第一个版面 page = 1; }else{ $img.animate({ top : '-='+img_height }, "slow"); //通过改变left值，达到每次换一个版面 page++; alert("yes"); } } return false; });});</script><style type="text/css">#img { border: 1px solid #ccc; width: 200px; height: 420px; overflow: hidden;}#new { height: 2500px;}ul li { list-style: none;}</style></head><body><div id="ibody"><div id="prev"> <a href="#"><img src="prev.ico" /></a></div><div id="img"> <div id="new"> <ul> <li><a href="#"><img src="01.jpg" /></a></li> <li><a href="#"><img src="01.jpg" /></a></li> <li><a href="#"><img src="01.jpg" /></a></li> <li><a href="#"><img src="01.jpg" /></a></li> <li><a href="#"><img src="02.jpg" /></a></li> <li><a href="#"><img src="02.jpg" /></a></li> <li><a href="#"><img src="02.jpg" /></a></li> <li><a href="#"><img src="02.jpg" /></a></li> <li><a href="#"><img src="03.jpg" /></a></li> <li><a href="#"><img src="03.jpg" /></a></li> <li><a href="#"><img src="03.jpg" /></a></li> <li><a href="#"><img src="03.jpg" /></a></li> <li><a href="#"><img src="04.jpg" /></a></li> <li><a href="#"><img src="04.jpg" /></a></li> <li><a href="#"><img src="04.jpg" /></a></li> <li><a href="#"><img src="04.jpg" /></a></li> </ul> </div></div><div id="next"> <a href="#" ><img src="next.ico" /></a></div></div> 展开

 我来答

1个回答

#热议# 普通体检能查出癌症吗？

jonggers
2013-05-23 · TA获得超过846个赞

知道小有建树答主

回答量：497

采纳率：0%

帮助的人：547万

我也去答题访问个人页

关注

展开全部

首先你的js代码设计有问题， animate的对象应该是$new而不是$img
另外CSS代码也有问题：
#new和#img都要加上position:relative;

更多追问追答

追问

呵呵,厉害,改过来,已经可以运行了,可是alert(page_count)的时候,为什么得到的是8而不是4呢,我一共才有16个li元素,每页4个,

追答

我建议你把以下这一段放到click事件外面：
var $parent = $(this).parents().find("div#ibody");
        var $img = $parent.find("div#img");
        var img_height = $img.height();
        var $new = $img.find("div#new");
        //alert(img_height);
        var li_lenth = $img.find("li").length;
        //alert(li_lenth);
        var page_count = Math.ceil(li_lenth / i);
        //alert(page_count);

因为这段代码在没点击按钮时都已经确定下来了，而你所说的alert(page_count)得8的问题，有可能是全局变量i在其它代码中发生了变化所至，但如果你按照我说的方法把代码移出去后应该就不会有问题了

本回答由提问者推荐

已赞过 已踩过<

评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

用是jQuery实现一个纵向的图片滚动,点击上下箭头为什么就是不换页呢,高手们帮忙看一下

其他类似问题

为你推荐：