jquery图片上下轮播的问题，怎么实现自动轮播？
function picTurn(elementId){
var $top = parseInt($(elementId).css('top'));
if ($top<-1140) {
$top=0;
};
$top -=228;
$top +='px';
$(elementId).animate({top:$top},"slow");
}
$(document).ready(function() {
picTurn('#picShow');
});
我在id为picShow中，放了我想要的5张图片，然后通过改变他的top数值来产生位移，以上代码可以实现将他从top=0px到top=-228px;的动画， 但是我想让他自动轮播，就是top依次变成-228，-456，-674……以此类推，当到第五张时从头开始，请问怎么弄？我知道应该要用到settimeout之类的，但是不会用……
1、html部分
<body><div id="banner">
<div id="banner_bg"></div><!--标题背景-->
<div id="banner_info"></div><!--标题-->
<ul>
<li class="on">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
<div id="banner_list">
<a href="#" target="_blank"><img src="imgs/p1.jpg" title="橡树小屋的blog" alt="橡树小屋的blog"/></a>
<a href="#" target="_blank"><img src="imgs/p5.jpg" title="橡树小屋的blog" alt="橡树小屋的blog"/></a>
<a href="#" target="_blank"><img src="imgs/p3.jpg" title="橡树小屋的blog" alt="橡树小屋的blog"/></a>
<a href="#" target="_blank"><img src="imgs/p4.jpg" title="橡树小屋的blog" alt="橡树小屋的blog"/></a>
</div>
</div>
</body>
2、css样式部分
<style type="text/css">#banner {position:relative; width:478px; height:286px; border:1px solid #666; overflow:hidden;}
#banner_list img {border:0px;}
#banner_bg {position:absolute; bottom:0;background-color:#000;height:30px;filter: Alpha(Opacity=30);opacity:0.3;z-index:1000;
cursor:pointer; width:478px;}
#banner_info{position:absolute; bottom:0; left:5px;height:22px;color:#fff;z-index:1001;cursor:pointer}
#banner_text {position:absolute;width:120px;z-index:1002; right:3px; bottom:3px;}
#banner ul {position:absolute;list-style-type:none;filter: Alpha(Opacity=80);opacity:0.8; border:1px solid #fff;z-index:1002;
margin:0; padding:0; bottom:3px; right:5px;}
#banner ul li { padding:0px 8px;float:left;display:block;color:#FFF;border:#e5eaff 1px solid;background:#6f4f67;cursor:pointer}
#banner ul li.on { background:#900}
#banner_list a{position:absolute;} <!-- 让四张图片都可以重叠在一起-->
</style>
3、jQuery部分
<script type="text/javascript">var t = n =0, count;
$(document).ready(function(){
count=$("#banner_list a").length;
$("#banner_list a:not(:first-child)").hide();
$("#banner_info").html($("#banner_list a:first-child").find("img").attr('alt'));
$("#banner_info").click(function(){window.open($("#banner_list a:first-child").attr('href'), "_blank")});
$("#banner li").click(function() {
var i = $(this).text() -1;//获取Li元素内的值，即1，2，3，4
n = i;
if (i >= count) return;
$("#banner_info").html($("#banner_list a").eq(i).find("img").attr('alt'));
$("#banner_info").unbind().click(function(){window.open($("#banner_list a").eq(i).attr('href'), "_blank")})
$("#banner_list a").filter(":visible").fadeOut(500).parent().children().eq(i).fadeIn(1000);
document.getElementById("banner").style.background="";
$(this).toggleClass("on");
$(this).siblings().removeAttr("class");
});
t = setInterval("showAuto()", 4000);
$("#banner").hover(function(){clearInterval(t)}, function(){t = setInterval("showAuto()", 4000);});
})
function showAuto()
{
n = n >=(count -1) ?0 : ++n;
$("#banner li").eq(n).trigger('click');
}
</script>
$(document).ready(function() {
setInterval(function(){
picTurn('#picShow');
}, 3000);
});追问
没错。后来，我再试试setInterval，是可以成功了，但是，当位移到第五张时突然变到第一张太生硬了，请问有没有解决方法，就是直接第五张到第一张，才能不突兀
追答可以的，把第一张图clone添加到末尾，然后判断条件那儿 if ($top<-1140) { 改成 if ($top<-1368) {
追问这样治标不治本啊，那第二张呢？不是也要再复制到末尾？我是说当$top<-1140时，突然把$top改为0，这样他在移动的时候就是一下子刷的跳到第一张了，这样很不自然，所以有没有什么办法可以再第五张的时候跳到第一张不用位移那么大，然后一张一张的循环位移
追答你可以试验一下，不用复制第二张图，只需要按我说的修改判断条件就可以了
追问不行啊，你看看登陆之后百度首页的那个新闻图片轮播，他在最后一张播过后很自然地到第一张了，你会做那个吗？
追答肯定可以的，图片轮播效果是最简单的几个效果之一了，主要是需要你控制好判断条件
本回答被提问者采纳但为什么不找个轮播插件用呢
jquery图片轮播思路
1、实现的总体思路：首先是初始化部分：将除了第一张轮播图片意外的图片都隐藏，并且隐藏向前、向后按钮，使第一个索引按钮处于激活状态。2、实现的具体事件处理思路：事件部分：通过jquery的hover()绑定鼠标上悬以及离开时的事件处理， jquery的bind()方法绑定鼠标点击事件处理向前、向后翻动、轮播控制：pr...
Jquery图片轮播循环问题,求大神指教,怎么实现循环播放?
--选项--> 不懂再问，这是我自己写的一个轮换，里面包括了点击事件，原理是控制图片的显示隐藏，别的有控制高度等等之类的 。
如何jQuery实现图片轮播的同时左右按钮可以实现切换?
建议，在当前轮播图的div添加类active，设置.active {display：block；}，.ban{display:none;};这样可以通过添加或移除active就可以了；这样以下就比较方便很多，要不然又要做循环，麻烦（swiper插件做轮播效果不错）(".left").click(function(){ var $index = $(".ban").hasClass("active").index...
怎么在这个JQ轮播上加自动滚动
看代码的格式是使用的jquery superslide插件，直接添加一个autoPlay:true参数就行了; JS部分的修改如下：<!-- 滚动图片 -->jQuery(".picScroll").slide({ mainCell:"ul", effect:"leftLoop", vis:4, scroll:2, autoPage:true, switchLoad:"_src", autoPlay:true });...
网页制作中如何制作滚动图片
通过 jQuery 实现网页制作中的滚动图片主要依赖于 JavaScript 代码的编写。以下步骤能够帮助您实现滚动图片的自动轮播效果。首先，确保您已引入 jQuery 库。然后，在 HTML 文件中为滚动图片添加容器元素和图片元素，容器元素应包含类名或 ID，例如： 接下来，在 JavaScript 中编写以下代码来实现滚动功能：定义...
下面的代码怎么修改,能实现图片轮播
图片轮播的话，有两种方式：1. 通过js控制图片的显隐来实现轮播：实现简单；通过定时器切换图片。这种方式我博客里有关键代码，可以百度以下内容查看：使用javascript,jquery实现的图片轮播功能[xyytIT]2. 通过定位方式，使图片按照从左到右，或上下的顺序排列，这种效果比较好，但是实现起来，比较麻烦；目前...
用jquery实现图片轮播怎么写呢求指教
\/*此处需要将溢出框架的图片部分隐藏*\/ } .slideShow ul{ width: 2500px; position: relative; \/*此处需注意relative : 对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置，如果没有这个属性，图片将不可左右移动*\/ } .slideShow ul li{ float: left...
如何用DW制作这种图片轮播的效果
这个是要css，结合js或者jq，才能做出来的。网络上都有现成的js代码，可以先学会css，然后自己去套用js代码就可以了。
jquery自动轮播图代码只能出现一张图片第二三张就空白了 轮播正常播 ...
第一张显示没问题，第二张以及之后的图片显示为空白。首先，排除掉图片路径没问题。（如果有问题，也不会网上提问了）初步判断，css静态定位错误。css样式固定在了第一张图片，第二，第三之后的css定位不到，则显示空白。即使在js中是动态定位的，但是请仔细检查你的图片的css的定位参数是否固定住了。...
图片不会自动切换 怎么加自动切换代码,
亲，图片自动切换也就是轮播图那样的效果的加个定时器就可以了，没有定时器切换不了
