如何用javascript实现图片新闻幻灯切换效果（不用flash）？

如何用javascript实现图片新闻幻灯切换效果（不用flash）？谢谢

解决方案 »

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>JS实现图片幻灯片效果</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<div align="center"><div id=AdRotator></div><input id="second"><button onclick="adRotator.set(getRef('second').value)">set time</button></div>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
</BODY>
</HTML>
晕死，你搜索下一大堆
前几天用到,刚封了一个...<!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=gb2312" />
<title>轻量封装图片轮动</title>
<script lanuage="javascript">
var ImgConvert = function (imgid, linkid) {
//构造参数
this.imgid = imgid;
this.linkid = linkid;
this.cursor = 0;
this.imgs = [];
};ImgConvert.prototype = { constructor : ImgConvert

, add : function (src, href) {
//缓存图片
return (this.imgs[this.imgs.length] = { obj : new Image, "href" : href }).obj.src = src;
}

, convert : function () {
//变化
var obj = this.imgs[this.cursor = this.cursor + 1 < this.imgs.length ? this.cursor + 1 : 0]
, img = document.getElementById(this.imgid);

if ('undefined' !== typeof img.style.filter) {
//如果不支持，就不用滤镜
img.style.filter = "blendTrans", img.filters(0).apply(), img.filters(0).play();
}

img.src = obj.obj.src, document.getElementById(this.linkid).href = obj.href;
}

, load : function () {
//初始化成员
var img = document.getElementById(this.imgid), i = 0, a = Array.prototype.slice.call(arguments, 0), t;

for (; i < a.length ; i ++) { t = a[i].split('|'), this.add(t[0], t[1]); }
}

};var wc = new ImgConvert('img', 'link');
wc.load(
'http://www.google.cn/intl/zh-CN/images/logo_cn.gif|http://www.google.com/'
, 'http://www.baidu.com/img/logo.gif|http://www.baidu.com/'
, 'http://www.csdn.net/images/newcsdnlogo.gif|http://www.csdn.net/'
);
window.onload = function () { window.setInterval(function () { wc.convert(); }, 3000); };
</script>
</head>
<body>
<a id="link" href="http://www.google.com/" target="_blank">
<img id="img" src="http://www.google.cn/intl/zh-CN/images/logo_cn.gif" border="0" alt="" />
</a>
</body>
</html>
<!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>
<style>
body, p, ul, li, dd, dt, dl, ol, form, h1, h2, h3, h4, h5 { margin:0; padding:0; }
body { font-size:12px; color:#000; text-align:left }
i, em { font-style:normal; }
img { border:none; vertical-align:middle; }
ul, li { list-style:none; min-height:12px; }
a { color:#555; text-decoration:none; }
a:hover { color:#cc0000; text-decoration:underline; }
.undis{display:none;}
.dis{display:block!important;}
#pic{position:absolute;top:0;left:0;z-index:9;width:308px;height:258px;}
#pic img{width:308px;height:258px;float:left;}
#textbg{position:absolute;left:0;bottom:0;z-index:99;width:308px;height:27px;background:url(http://mat1.gtimg.com/sports/nba2011/images/flash_bg.png);_background:none;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale,src="http://mat1.gtimg.com/sports/nba2011/images/flash_bg.png");}
#text{position:absolute;left:0;bottom:0;z-index:999;width:308px;height:27px;line-height:27px;color:#fff;}
#text p{width:100%;height:27px;line-height:27px;color:#fff;text-align:center;font-size:14px;}
#text p a{color:#fff;}
#tip{width:308px;height:15px;position:absolute;right:0;bottom:28px;z-index:999;text-align:right;}
#tip span{width:16px;height:15px;line-height:15px;background:#7B7B7B;cursor:pointer;display:inline-block;margin-left:1px;text-align:center;color:#fff;}
#tip span.current{background:#000;}
</style>
</head>
<body>
<div id="pic">
        <a href="http://zhibo.sports.qq.com/sports/1162/index.html"><img src="http://img1.gtimg.com/sports/pics/hv1/224/17/723/47017634.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000515.htm#p=1"><img src="http://img1.gtimg.com/sports/pics/hv1/184/194/722/46997704.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000465.htm"><img src="http://img1.gtimg.com/sports/pics/hv1/122/189/722/46996367.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000356.htm"><img src="http://img1.gtimg.com/sports/pics/hv1/112/185/722/46995337.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000417.htm"><img src="http://img1.gtimg.com/sports/pics/hv1/93/187/722/46995828.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000303.htm#p=2"><img src="http://img1.gtimg.com/sports/pics/hv1/20/180/722/46993970.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000262.htm"><img src="http://img1.gtimg.com/sports/pics/hv1/61/177/722/46993246.jpg" class="undis" border="0"></a>
        <a href="http://sports.qq.com/a/20110220/000324.htm#p=1"><img src="http://img1.gtimg.com/sports/pics/hv1/205/181/722/46994410.jpg" class="undis" border="0"></a>
    <div id="textbg"></div>
        <div id="text">
        <p class="undis"><a href="http://zhibo.sports.qq.com/sports/1162/index.html">正在直播全明星东西部对抗赛皇帝对决科比</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000515.htm#p=1">全明星扣篮大赛格里芬击败麦基得冠军</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000465.htm">全明星三分球大赛热火琼斯闪耀捧杯</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000356.htm">亚特兰大队捧杯瞬间霍福德笑开怀</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000417.htm">全明星技巧挑战赛库里28.2秒成功夺魁</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000303.htm#p=2">科比星光大道留手脚印模成篮坛第一人</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000262.htm">纳什闪电离婚内幕曝光前妻与巴博萨偷情生子</a></p>
        <p class="undis"><a href="http://sports.qq.com/a/20110220/000324.htm#p=1">腾讯直击全明星美女明星黄奕现场微博爆料</a></p>
        </div>
        <div id="tip"><span>1</span><span>2</span><span>3</span><span>4</span><span>5</span><span>6</span><span>7</span><span>8</span></div>
  </div>
   <script>
function change(id){
if (typeof(isround)!='undefined') clearTimeout(isround);
var bigimg = document.getElementById("pic").getElementsByTagName("img");
var smallimg = document.getElementById("tip").getElementsByTagName("span");
var text = document.getElementById("text").getElementsByTagName("p");
for (var i = 0; i < smallimg.length; i++) {
bigimg[i].className="undis";
smallimg[i].className="";
text[i].className="undis";
}
bigimg[id-1].className="dis";
smallimg[id-1].className="current";
text[id-1].className="dis";
if ((next=id+1) > smallimg.length) next = 1;
isround=setTimeout('change('+next+')', 4000);
}
change(1);
</script>
</body>qq的.
http://www.banmagu.com
全部是用javascript实现的。