Rss & SiteMap

咿思舞论坛 http://bbs.145829.com

http://bbs.145829.com 咿思舞论坛 咿思舞网络科技有限公司 网站建设 空间域名 高端服务器
共1 条记录, 每页显示 10 条, 页签: [1]
[浏览完整版]

标题:巧使网页图片实现“幻灯片”显示效果

1楼
admin 发表于:2009/11/11 15:20:39
Blendtrans滤镜可以使图片产生淡入淡出的幻灯效果,如下:

<iframe src="wy.files/blendtrans.htm" frameborder="no" width="120" scrolling="no" height="150"></iframe>

  制作过程:

  一、准备图片10张,文件名为0.jpg9.jpg

图片点击可在新窗口打开查看 图片点击可在新窗口打开查看 图片点击可在新窗口打开查看 图片点击可在新窗口打开查看 图片点击可在新窗口打开查看
图片点击可在新窗口打开查看 图片点击可在新窗口打开查看 图片点击可在新窗口打开查看 图片点击可在新窗口打开查看 图片点击可在新窗口打开查看

  二、建立一个CSS样式作为图片边框。

  代码:

<style>
body img{border:3 gold ridge}
</style>

  三、将下列代码放到<head>间。

  代码:

  <script language="JavaScript">
  function ImgArray(len)
  {
   this.length=len;
   }
  ImgName=new ImgArray(10);
  ImgName[0]="0.jpg";
  ImgName[1]="18.jpg";
  ImgName[2]="28.jpg";
ImgName[3]="3.jpg";
  ImgName[4]="4.jpg";
  ImgName[5]="5.jpg";
ImgName[6]="6.jpg";
  ImgName[7]="7.jpg";
  ImgName[8]="8.jpg";
ImgName[9]="9.jpg";
  var t=0;
  function playImg()
  {
if (t==9)
   {t=0;}
   else
   {t++;}
img.style.filter="blendTrans(Duration=3)";
  img.filters[0].apply();
  img.src=ImgName[t];
  img.filters[0].play();
  mytimeout=setTimeout("playImg()",5000);
   }
</script>

  四、将下列代码放到<body>里。

<body bgcolor="#FFFFFF" text="#000000" >
<img src="0.jpg" width="96" height="120" name="img" >
共1 条记录, 每页显示 10 条, 页签: [1]

版权所有 © 2008-2011 咿思舞网络科技有限公司    QQ群 ①:90702197 ②:22570168 ③:16291161 备案:粤ICP备09104757号
小刘QQ:小刘①①137048462 小刘②②136736158

E-mail: ysw829@163.com BBS.145829.com
Processed in 0.04712 s, 2 queries.