中国IT动力,最新最全的IT技术教程
最新100篇 | 推荐100篇 | 专题100篇 | 排行榜 | 搜索 | 在线API文档
首 页 | 程序开发 | 操作系统 | 软件应用 | 图形图象 | 网络应用 | 精文荟萃 | 教育认证 | 硬件维护 | 未整理篇 | 站长教程
ASP JS PHP工程 ASP.NET 网站建设 UML J2EESUN .NET VC VB VFP 网络维护 数据库 DB2 SQL2000 Oracle Mysql
服务器 Win2000 Office C DreamWeaver FireWorks Flash PhotoShop 上网宝典 CorelDraw 协议大全 网络安全 微软认证
硬件维护  CPU  主板  硬盘  内存  显卡  显示器  键盘鼠标  声卡音箱  打印机  机箱电源  BIOS  网卡  C#  Java  Delphi  vs.net2005
  当前位置:> 程序开发 > Web开发 > 临时文章
Banner展示类TBanner(2) in JScript
作者:未知 时间:2005-07-27 23:33 出处:CSDN 责编:chinaitpower
              摘要:Banner展示类TBanner(2) in JScript
名称:TBanner
功能:在同一位置展示多张图片链接,图片链接之间采用某种效果切换
      同一个页面可以显示多个这样的Banner,互不影响
特点:使用简单
类名:TBanner
方法:init(basepath,images,urls) //basepath为图像所在的目录
                                 //images是图像文件名数组
                                 //urls是每个图片所对应链接地址数组,如果少于图片数,则用第一个地址代替
      setEffect(filter,fnEffect)//filter是滤镜名及参数,
                //fnEffect是名部函数,原型是fnEffect(obj),obj是显示的图片对象
                  这个函数可在外部改变滤镜参数,以使每次作用效果不同
      start(delay)//开始自动播放图片链接,delay是每张图片切换间隔时间,ms为单位
      stop()      //停止自动切换图片及链接
      play()      //切换一次图片链接,同时播放效果,一般不用
    
例子:
 var banner_example=new TBanner();//声明一个对像banner_example,然后调用init初始化 
 banner_example.init("images/",//图象基地址
   new Array("r0.gif","r1.gif"), //图象名
   new Array("http://www.impx.net")); //对应图片链接
 //banner.setEffect("progid:DXImageTransform.Microsoft.Fade(duration=2)");//设置新的效果,没有则调用默认的
 banner_example.start(2000);//开始,设置图片切换的间隔时间2秒

演示地址:http://impx.net/scripts/tbanner.htm

TBanner(2) in JScript

Posted on Saturday, February 12, 2005 11:28 PM

/*重新写了一下这个类,把原来几个函数都移了进去,并且加一个setEffect用来设置滤镜和效果!这样就可以从外部编写函数来增强效果了!并且不用再把对象名传递给类了!保留了对原来的兼容,对外只增加一个setEffect,当然还有play和stop。
演示地址:http://impx.net/scripts/tbanner.htm
*/

/*=============================
 Copyright by dragonimp
 All rights reserved.
 
  Description:class for TBanner
 
  version0.1 2004.8.26  first thought to make a class for banner
  version1.0 2004.11.24 simple function to support a banner
  version1.1 2004.12.10 basic effect in class
  version1.2 2005.2.6   setEffect to add other filters and effects
 
  Email:dragonimp@impx.net
  HomePage:http://www.impx.net
==============================
//Usage:(4 steps to run a banner)
 0. First of all, you should include this file in your source.
  1. new TBanner to initialize a new TBanner object
 2. init the base path of images, names of images, and urls for links. first as default;
  3. setEffect to play unique effection. If omitted, it will play with default effection.
 4. start with interval time.

 //example:
 var banner_example=new TBanner();
 banner_example.init("/images/rotate/",new Array("r1.gif","r2.gif","r3.gif"),new Array("url1","url2","url3"));
 //banner_example.setEffect("progid:DXImageTransform.Microsoft.GradientWipe(duration=1.5,gradientSize=0.75,motion=forward)",null)
 //banner_example.setEffect("revealTrans(Duration=2.0,Transition=1)",function(obj){obj.filters[0].Transition = Math.floor(Math.random() * 23);})
 banner_example.start(5000);//millisecond
 
==============================*/


function TBanner()
{
 //create a contianer
 //==================================== 
 this.container=document.createElement("div");
 //document.body.appendChild(this.banner); this cannot work at unstandard env.
 var contianerID="TBannerContainer_"+this.container.uniqueID;
 document.write("<div id='"+contianerID+"'></div>");
 delete this.container;
 this.container=eval(contianerID);
   
 this.image=window.document.createElement("img");
 this.link=window.document.createElement("a");
 
 this.container.appendChild(this.link);
 this.link.appendChild(this.image); 
 //====================================
 
 this.id="banner_"+this.container.uniqueID;
 eval(this.id+"=this");//set the REAL bannerid as this object

 this.container.style.filter="revealTrans(Duration=2.0,Transition=1)";
 this.container.margin=0;
 this.container.padding=0;
 
 this.image.border=0;
 this.image.style.filter=this.container.style.filter;
 this.image.alt=this.id;
 
 this.link.target="_blank"; 
 
 this.index=0;
 this.delaytime=5000;
 this.timer=null;


 //public:

 this.init = function(basepath,images,urls)
 {
  this.imagebasepath=basepath;
  this.images=images;
  this.urls=urls;
  this.PreloadImages(images);
     
  this.switchBanner();//show first banner
 }
 
 this.start = function(delaytime)
 { 
  this.delaytime=(delaytime==null)?this.delaytime:delaytime;
  this.timer=setInterval(this.id+".play()",this.delaytime);
 }
 
 this.stop = function()
 {
  window.clearTimeout(this.timer);
  this.timer=null;
 }
 
 this.setEffect = function(filter,fnSwitch)
 {
  this.container.style.filter=filter;
  this.image.style.filter=filter;
  this.switchEffect=(fnSwitch==null)?function(){}:fnSwitch;
 }
  
 //switch to next banner and play effection
 this.play = function()
 {
  obj=this.image;//this.container doesn't work, why???
  //obj.style.visibility="hidden";
  obj.filters[0].Apply();
  this.switchBanner();
  obj.style.visibility="visible";
  obj.filters[0].Play();  
  
  this.switchEffect(obj);
 };
 
 
 //private:
 
 //default Effect Action
 this.switchEffect = function(obj)
 {
  obj.filters[0].Transition = Math.floor(Math.random() * 23);
 }
  
 //show next banner
 this.switchBanner = function()
 {
  var banner=this;
  if (banner.index<banner.urls.length)//change link
   banner.link.href=banner.urls[banner.index];
  else
  {
   if (banner.urls[0]!=null)
   {
    banner.link.href=banner.urls[0];
    banner.link.title=banner.link.href;
    banner.link.disabled=false;
    banner.link.target="_self";
   }
   else
   {
    banner.link.href="#";
    banner.link.target="_self";
    banner.link.disabled=true;
   }
  }
  banner.image.src=banner.imagebasepath+banner.images[banner.index];

  banner.index++;
  if(banner.index >= banner.images.length)banner.index=0;
 } 

 //Load images before play
 this.PreloadImages = function(images)
 {
  var preloadedimages=new Array()
  for (i=0;i<images.length;i++)
  {
   preloadedimages[i]=new Image()
   preloadedimages[i].src=images[i];
  }
  delete preloadedimages;
 }
}


关闭本页
 
首页 | 投资与合作 | 服务条款 | 隐私政策 | 收藏本站 | 设为首页 | 新用户注册 | 免责声明 | 使用帮助
Copyright ©2005-2008 chinaitpower.com All rights reserved. www.chinaitpower.com 版权所有