这个是模仿腾讯新闻首页的图片切换代码，可点击窗口右下角图片编号切换显示，兼容当前主流浏览器。
<!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" />
<meta name="keywords" content="武鸣人网站,武鸣信息网,武鸣本地网,武鸣信息资源平台,减肥,健身,励志,励志语录,js特效,网页特效,www.wuming.ren">
<meta name="description" content="欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。">
<title>仿腾讯新闻首页js图片切换代码_武鸣人</title>
<style>
body{margin:0;padding:0;}
td,body,select,input{font-size:12px; color:#000; }
a{color:#000; text-decoration:none;}
a:hover{color:#ff0000; text-decoration:underline;}
img{border:none; padding:0; margin:0;}
</style>
</head>
<body>
<a href="https://www.wuming.ren">武鸣人</a>，各种信息资源免费发布，分享励志语录经典短句，减肥健身常识，各种js特效代码。网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)<hr>
<!--欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。-->
<script type="text/javascript" src="https://www.wuming.ren/ad/tc.js"></script>
<script type="text/javascript" src="https://www.wuming.ren/ad/a.js"></script>
<table width=910 border=0 cellpadding=0 cellspacing=1 bgcolor="9BB0C1" align="left">
<tr>
<td width="534" bgcolor="CFDAE0" align="right" valign="top">
<table width="534" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="15"></td>
</tr>
<tr>
<td align="left">
<style type="text/css">
.bigon{background:url(/img/20240320_www_wuming_ren_13.gif);color:#FFF; line-height:15px;}
.bigoff{background:url(/img/20240320_www_wuming_ren_14.gif);color:#000; line-height:15px;}
a.bla{color:#000; text-decoration:none}
a.bla:hover{color:#F00; text-decoration:underline}s
</style>
<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="500"><div id="fc" style="width:500px;height:380px;filter:progid:DXImageTransform.Microsoft.Fade ( duration=0.5,overlap=1.0 );">
<div style="display:block;">
<!-- 图1 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_6.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
<div style="display:none;">
<!-- 图2 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_7.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
<div style="display:none;">
<!-- 图3 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_8.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
<div style="display:none;">
<!-- 图4 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_9.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
<div style="display:none;">
<!-- 图5 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_10.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
<div style="display:none;">
<!-- 图6 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_11.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
<div style="display:none;">
<!-- 图7 -->
<a href="https://www.wuming.ren" target="_blank"><img name="page_cnt_1" src="/img/20240320_www_wuming_ren_12.jpg" style="BORDER: #ffffff 1px solid; " width="500" height="380" border="0" onMouseOver="clearAuto();" onMouseOut="setAuto()" /></a></div>
</div>
</td>
</tr>
<tr>
<td height="26" background=""><table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="300" align="center" onmouseover="clearAuto();" onMouseOut="setAuto()">
<div id="con">
<div style="display:block;">
<!-- 图1 -->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>云南保山民众感伤家园被毁</b></a></div>
<div style="display:none;">
<!-- 图2 -->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>巴以直接谈判在华盛顿重启<b></a></div>
<div style="display:none;">
<!-- 图3 -->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>世博园最美工作人员 曾摘世界小姐桂冠</b></a></div>
<div style="display:none;">
<!-- 图4-->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>腾讯一周精选：金钱鲨误入渔网窒息死亡</b></a></div>
<div style="display:none;">
<!-- 图5 -->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>德国民众向政府大楼扔鞋抗议火车站改建</b></a></div>
<div style="display:none;">
<!-- 图6 -->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>美国男子造喷气校车 可喷出20米长火舌</b></a></div>
<div style="display:none;">
<!-- 图7 -->
<a href="https://www.wuming.ren" target="_blank" style="FONT-SIZE: 14px;"> <b>水上运动会花样游泳表演“出水芙蓉”</b></a></div>
</div> </td>
<td width="200">
<table border="0" align="center" cellpadding="0" cellspacing="3" class="lhn" id="num">
<tr>
<td width="15" height="15" align="center" class="bigon" onclick="Mea(0);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">1</td>
<td width="15" align="center" class="bigoff" onclick="Mea(1);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">2</td>
<td width="15" align="center" class="bigoff" onclick="Mea(2);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">3</td>
<td width="15" align="center" class="bigoff" onclick="Mea(3);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">4</td>
<td width="15" align="center" class="bigoff" onclick="Mea(4);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">5</td>
<td width="15" align="center" class="bigoff" onclick="Mea(5);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">6</td>
<td width="15" align="center" class="bigoff" onclick="Mea(6);" onmouseover="clearAuto();" onmouseout="setAuto()" style="cursor:pointer;">7</td>
</tr>
</table>
</td>
</tr>
</table></td>
</tr>
</table>
<script>
var n=0;
var showNum = document.getElementById("num");
function Mea(value){
n=value;
setBg(value);
plays(value);
cons(value);
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function setBg(value){
for(var i=0;i<7;i++)
if(value==i){
showNum.getElementsByTagName("td")[i].className='bigon';
}
else{
showNum.getElementsByTagName("td")[i].className='bigoff';
}
}
function plays(value){
try
{//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
with (fc)
{
filters[0].Apply();
for(i=0;i<7;i++)i==value?children[i].style.display="block":children[i].style.display="none";
filters[0].play();
}
}
catch(e)
{
var divlist = document.getElementById("fc").getElementsByTagName("div");
for(i=0;i<7;i++)
{
i==value?divlist[i].style.display="block":divlist[i].style.display="none";
}
}
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function cons(value){
try
{
with (con)
{
for(i=0;i<7;i++)i==value?children[i].style.display="block":children[i].style.display="none";
}
}
catch(e)
{
var divlist = document.getElementById("con").getElementsByTagName("div");
for(i=0;i<7;i++)
{
i==value?divlist[i].style.display="block":divlist[i].style.display="none";
}
}
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function clearAuto(){clearInterval(autoStart)}
function setAuto(){autoStart=setInterval("auto(n)", 5000)}
function auto(){
n++;
if(n>6)n=0;
Mea(n);
}
function sub(){
n--;
if(n<0)n=6;
Mea(n);
}
setAuto();
//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
</script><!--[if !IE]>|xGv00|657b1020e1a5c19c61e544a42ee59fd5<![endif]-->
</td>
</tr>
</table>
</td>
<td width="376" height="440" bgcolor="#FFFFFF"><!--[if !IE]>|xGv00|378f63c1b1d886fd8bfcf4eabd0400e1<![endif]-->仿腾讯新闻首页js图片切换特效 <a href="https://www.wuming.ren">武鸣人</a>整理收集</td>
</tr>
</table>
</body>
</html>本文来自武鸣人网站，转载请注明出处