该功能怎么实现？？？急求

具体效果看：http://www.mbaobao.com/ 底部热门评论区块，该功能js或jquery怎么实现，高分求实现代码，或是思路，请懂的指点指点下面是jquery的一些代码，但是本人对jquery是刚入门，无法看透//评论滚动
var comment_list = $("#comment-list");
var comment_interval;
if(comment_list.find(".item").size()>5){
setTimeout(function(){
comment_list.find("img").each(function(){
var src2 = $(this).attr("src2");
$(this).attr("src",src2);
});
comment_interval = comment_scroll();
},2000)
comment_list.bind("mouseover",function(){
clearInterval(comment_interval);
}).bind("mouseout",function(){
comment_interval = comment_scroll();
});
}能实现效果就行，谢谢了

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

简单实现方法，楼主根据实际情况修改<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
</head>
<style>
.item{height:92px;overflow:hidden;border-bottom:1px solid #EFEFEF;margin-bottom:10px;color:blue}
</style>
<script type="text/javascript" src="jquery-1.6.4.min.js"></script></head>
<body>
<div id="testID" style="height:450px;overflow: hidden;">
<div class="item">111111</div>
<div class="item">222222</div>
<div class="item">333333</div>
<div class="item">444444</div>
<div class="item">555555</div>
<div class="item">666666</div>
<div class="item">777777</div>
<div class="item">888888</div>
<div class="item">999999</div>
</div>
</body><script>
$(function() {
//滚动函数
function scroll(){
//每次将第一个div移到尾部
$("#testID").append(function(){
return $(this).find(".item:first");
});
//将第一个div以0毫秒的速度收起来，然后再以2000毫秒的速度往下滑动
$(".item:first").slideUp(0).slideDown(2000);
}
//每2000毫秒执行一次滚动函数
var timeObj = setInterval(function(){
scroll();
}, 2000)

//鼠标移入DIV时取消滚动，移出时继续滚动
$("#testID").mouseover(function(){
clearInterval(timeObj);
}).mouseout(function(){
timeObj = setInterval(function(){
scroll();
}, 2000)
});
});
</script>
</html>
已经接近我要的了，不过我要的是内容也要一起随着循环滚动的，你那里是每次都是执行第一个div隐藏和出现而已，我要的是每执行一次，每个div就向下移动一个div的高度，遇到最后一个div就变成第一div
不会.我的效果应该就是你说的啊。不是普通的第一个DIV隐藏和出现。。再看清楚点
你看清楚点。我的代码已经是实现了，并不是第一个DIV隐藏和出现。。
你的的代码是可以实现，只不过是你现在的滚动的内容是向上滚动，我要的是向下滚动，你能不能把这步
//每次将第一个div移到尾部
        $("#testID").append(function(){
            return $(this).find(".item:first");
        });改为‘每次将最后一个div移动第一位’，本人对jquery才刚入门，不太懂用，只能用些简单的
��$("#testId").prepend(function(){$(this).find(".item:last)}��
花了点时间终于按自己的思路，把效果给弄出来了，下面是代码：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="css/css.css"/>
<style type="text/css">
body {
margin:0;
padding:0;
font-size:12px;
}
ul, li {
margin:0;
padding:0;
list-style:none;
}
.total {
width:500px;
height:400px;
border:2px solid #f60;
margin:0 auto;
overflow:hidden;
}
.total ul li {
width:500px;
height:100px;
float:left;
}
.div3 {
width:496px;
height:96px;
overflow:hidden;
border:2px solid #0CF;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
huan();
$("#div1").mouseover(function(){clearTimeout(ff)});
$("#div1").mouseout(function(){ff=setTimeout("huan()",2000);});
});
var ff;
function huan(){
var num=document.getElementById('div1').getElementsByTagName('li').length-1;
var b=document.getElementById('b');
b.innerHTML=document.getElementById('b'+num).innerHTML;
     for(var i=num;i>0;i--){
if(i==1){
document.getElementById('b1').innerHTML=b.innerHTML;
$("#b1").hide().slideDown(800);
}else{
document.getElementById('b'+i).innerHTML=document.getElementById('b'+(i-1)).innerHTML;
}
}
ff=setTimeout("huan()",2000);
}
</script>
</head>
<body>
<div class="total" id="div1">
  <ul>
    <li id="b1">
      <div style="background-color:#D1D1D1" class="div3">11111111</div>
    </li>
    <li id="b2">
      <div style="background-color:#FFCAE4;" class="div3">222222222222</div>
    </li>
    <li id="b3">
      <div style="background-color:#D8F1E0; color:#069;" class="div3">3333333333</div>
    </li>
    <li id="b4">
      <div style="background-color:#FFCACA; color:#C60;" class="div3">4444444444</div>
    </li>
    <li id="b5">
      <div style="background-color:#E4E4E4; color:#06F;" class="div3">55555555555</div>
    </li>
    <li id="b"></li>
  </ul>
</div>
</body>
</html>
借用1楼的代码改了下<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
</head>
<style>
.item{height:92px;overflow:hidden;border-bottom:1px solid #EFEFEF;margin-bottom:10px;color:blue}
</style>
<script type="text/javascript" src="jquery.js"></script></head>
<body>
<div id="testID" style="height:450px;overflow: hidden;">
<div class="item">111111</div>
<div class="item">222222</div>
<div class="item">333333</div>
<div class="item">444444</div>
<div class="item">555555</div>
<div class="item">666666</div>
<div class="item">777777</div>
<div class="item">888888</div>
<div class="item">999999</div>
</div>
</body><script>
$(function() {
    //滚动函数
    function scroll(elem){
     //找到最后一个div隐藏，并移动到最前面去，再以2000毫秒的速度往下滑动显示
     elem.find(".item:last").hide().prependTo(elem).slideDown(2000);
    }
    //获取测试容器
    var container = $("#testID");
    //每2000毫秒执行一次滚动函数
    var timeObj = setInterval(function(){
        scroll(container);
    }, 2000)

    //鼠标移入DIV时取消滚动，移出时继续滚动
    $("#testID").mouseover(function(){
        clearInterval(timeObj);
    }).mouseout(function(){
        timeObj = setInterval(function(){
            scroll(this);
        }, 2000)
    });
});
</script>
</html>
上面有点小错误，修正下，另外8楼的代码让我很纠结，既然用了jquery为嘛还有getElementById()这种东西？逻辑也有点绕。。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
</head>
<style>
.item{height:60px;overflow:hidden;border-bottom:2px solid #EFEFEF;margin-bottom:10px;color:blue}
#testID{width: 30%;height:400px;overflow: hidden;border: 5px solid black;padding: 10px;}
</style>
<script type="text/javascript" src="jquery.js"></script></head>
<body>
<div id="testID">
<div class="item">111111</div>
<div class="item">222222</div>
<div class="item">333333</div>
<div class="item">444444</div>
<div class="item">555555</div>
<div class="item">666666</div>
<div class="item">777777</div>
<div class="item">888888</div>
<div class="item">999999</div>
</div>
</body><script>
$(function() {
    //滚动函数
    function scroll(elem){
     //找到最后一个div隐藏，并移动到最前面去，再以2000毫秒的速度往下滑动显示
     elem.children().last().hide().prependTo(elem).slideDown(2000);
    }
    //获取测试容器
    var container = $("#testID");
    //每2000毫秒执行一次滚动函数
    var timeObj = setInterval(function(){
        scroll(container);
    }, 2000)

    //鼠标移入DIV时取消滚动，移出时继续滚动
    $("#testID").mouseenter(function(){
        clearInterval(timeObj);
    }).mouseleave(function(){
     var elem = $(this);
        timeObj = setInterval(function(){
            scroll(elem);
        }, 2000)
    });
});
</script>
</html>