新闻图片幻灯片切换展示特效

9个月前 (03-07 21:23)阅读回复0
大陆
大陆
  • 管理员
  • 发消息
  • 注册排名1
  • 经验值5294
  • 级别管理员
  • 主题1058
  • 回复2
楼主

仿腾讯新闻幻灯片切换特效，带标题和内容描述同时切换，右下角带编号按钮，鼠标经过停止切换，移开后继续切换显示。

<html>
<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>新闻图片幻灯片切换展示特效_武鸣人</title>
<style>
td,body,select,input{font-size:12px; color:#000; }
a{color:#000; text-decoration:none;}
.pic_2_www_wuming_ren img{border:1px solid #fff}
.in_wuming_ren{background:url(/img/20240307_www_wuming_ren_70.gif); color: #fff; width:15px; height:15px; line-height:15px;}
.out_wuming_ren{background:url(/img/20240307_www_wuming_ren_71.gif); color: #3f4040; width:15px; height:15px; line-height:15px;}
</style>
<script type="text/javascript">
var m=0;
function wumingren(value){
 m=value;
 bg_wuming(value);
 xplays(value);
 wwwwumingren_1(value);
 }//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function bg_wuming(value){
 for(var i=0;i<5;i++)
   if(value==i){
  document.getElementById("xt"+value+"").className='in_wuming_ren';
  }
 else{
  document.getElementById("xt"+i+"").className='out_wuming_ren';
  }
 }//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function xplays(value){
 try
 {
  with (www_wuming_ren)
  {
   filters[0].Apply();
   for(i=0;i<5;i++)i==value?children[i].style.display="block":children[i].style.display="none";
   filters[0].play();
  }
 }//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
 catch(e)
 {
  var divlist = document.getElementById("www_wuming_ren").getElementsByTagName("div");
  for(i=0;i<5;i++)
  {
   i==value?divlist[i].style.display="block":divlist[i].style.display="none";
  }
 }
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function wwwwumingren_1(value){
 try
 {
  with (wumingren_1)
  {
    for(i=0;i<5;i++)i==value?children[i].style.display="block":children[i].style.display="none";
  }
 }
 catch(e)
 {
  var divlist = document.getElementById("wumingren_1").getElementsByTagName("div");
  for(i=0;i<5;i++)
  {
   i==value?divlist[i].style.display="block":divlist[i].style.display="none";
  }
 }
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function clearauto_wwwwumingren(){clearInterval(xautoStart)}
function auto_www_wuming_ren(){xautoStart=setInterval("xAuto(m)", 3000)}<!--图片转换速度，数字越大越慢-->
function xAuto(){
 m++;
 if(m>4)m=0;
 wumingren(m);
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function xSub(){
 m--;
 if(m<0)m=4;
 wumingren(m);
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
auto_www_wuming_ren();
</script>
</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>
<div style="width:350px; margin-top:6px; position:relative;">
<table style="margin-left:8px;" cellSpacing="0" cellPadding="0" width="350" align="center" border="0">
<tr>
<td width="425" height="271" align="center" valign="top">
<div id="www_wuming_ren" style="width:350px; height:259px; margin-left:auto; margin-right:auto;">
<div style="display:block;" class="pic_2_www_wuming_ren">
<a href="https://www.wuming.ren" target="_blank"><img src="/img/20240307_www_wuming_ren_72.jpg" width="350" height="271" border=0></a></div>
<div style="display:none;" class="pic_2_www_wuming_ren">
<a href="https://www.wuming.ren" target="_blank"><img src="/img/20240307_www_wuming_ren_73.jpg" width="350" height="271" border=0></a></div>
<div style="display:none;" class="pic_2_www_wuming_ren"><a href="https://www.wuming.ren" target="_blank"><img src="/img/20240307_www_wuming_ren_76.jpg" width="350" height="271" border=0></a></div>
<div style="display:none;" class="pic_2_www_wuming_ren">
<a href="https://www.wuming.ren" target="_blank"><img src="/img/20240307_www_wuming_ren_74.jpg" width="350" height="271" border=0></a></div>
<div style="display:none;" class="pic_2_www_wuming_ren"><a
href="https://www.wuming.ren" target="_blank"><img src="/img/20240307_www_wuming_ren_75.jpg" width="350" height="271" border=0></a></div>
</div></td>
</tr>
<tr>
<td>
<table width="350" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="80" bgcolor="#FCE302">
<div style="position:absolute; left:200px; top:290px;">
<table id="xnum" cellspacing="3" cellpadding="0" align="right" border="0">
<tr>
<td class="in_wuming_ren"  style="cursor: pointer" onClick="wumingren(0);" onMouseOver="clearauto_wwwwumingren()" onMouseOut="auto_www_wuming_ren()" align="center" width="15" height="18" id="xt0">1</td>
<td class="out_wuming_ren" style="cursor: pointer" onClick="wumingren(1);" onMouseOver="clearauto_wwwwumingren()" onMouseOut="auto_www_wuming_ren()" align="center" width="15" id="xt1">2</td>
<td class="out_wuming_ren" style="cursor: pointer" onClick="wumingren(2);" onMouseOver="clearauto_wwwwumingren()" onMouseOut="auto_www_wuming_ren()" align="center" width="15" id="xt2">3</td>
<td class="out_wuming_ren" style="cursor: pointer" onClick="wumingren(3);" onMouseOver="clearauto_wwwwumingren()" onMouseOut="auto_www_wuming_ren()" align="center" width="15" id="xt3">4</td>
<td class="out_wuming_ren" style="cursor: pointer" onClick="wumingren(4);" onMouseOver="clearauto_wwwwumingren()" onMouseOut="auto_www_wuming_ren()" align="center" width="15" id="xt4">5</td>
</tr>
</table>
</div>
<div id="wumingren_1">
<div style="display:block">
<table width="305" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="24"><a href="https://www.wuming.ren" target="_blank"><strong>
<span style="font-size: 14px">武鸣人一号广告图片</span></strong></a></td>
</tr>
<tr>
<td >努力是一种状态，与年龄无关，越努力越幸运，越自律越优秀！</td>
</tr>
</table>
</div>
<div style="display:none">
<table width="305" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="24"><a href="https://www.wuming.ren" target="_blank"><strong>
<span style="font-size: 14px">武鸣人二号广告图片</span></strong></a></td>
</tr>
<tr>
<td >努力是一种状态，与年龄无关，越努力越幸运，越自律越优秀！</td>
</tr>
</table></div>
<div style="display:none">
<table width="305" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="24"><a href="https://www.wuming.ren" target="_blank"><strong>
<span style="font-size: 14px">武鸣人三号广告图片</span></strong></a></td>
</tr>
<tr>
<td >努力是一种状态，与年龄无关，越努力越幸运，越自律越优秀！</td>
</tr>
</table>
</div>
<div style="display:none">
<table width="305" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="24"><a href="https://www.wuming.ren" target="_blank"><strong>
<span style="font-size: 14px">武鸣人四号广告图片</span></strong></a></td>
</tr>
<tr>
<td >努力是一种状态，与年龄无关，越努力越幸运，越自律越优秀</td>
</tr>
</table></div>
<div style="display:none">
<table width="305" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="24"><a href="https://www.wuming.ren" target="_blank"><strong>
<span style="font-size: 14px">武鸣人五号广告图片</span></strong></a></td>
</tr>
<tr>
<td>努力是一种状态，与年龄无关，越努力越幸运，越自律越优秀</td>
</tr>
</table></div>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>


赞0
踩0
☆收藏0

本文来自武鸣人网站，转载请注明出处

本文地址：https://www.wuming.ren/a/239.html

按钮编号图片切换右下角
回帖

新闻图片幻灯片切换展示特效 期待您的回复！

取消
载入表情清单……
载入颜色清单……
插入网络图片

取消确定

图片上传中
编辑器信息
提示信息