68、超酷广告图片轮换

68、超酷广告图片轮换

脚本说明:

把如下代码加入<body>区域中

<style type=text/css>

#divScroller1 {      HEIGHT: 278px; OVERFLOW: hidden; POSITION: absolute; WIDTH: 438px; Z-INDEX: 9; visbility: visible}

.dynPage {     COLOR: black; FONT-FAMILY: arial,helvetica,sans-serif; FONT-SIZE: 12px; LEFT: 0px; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; Z-INDEX: 10}

</style>

<script language=JavaScript type=text/javascript>

function lib_bwcheck(){ //Browsercheck (needed)

       this.ver=navigator.appVersion

       this.agent=navigator.userAgent

       this.dom=document.getElementById?1:0

       this.opera5=this.agent.indexOf("Opera 5")>-1

       this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;

       this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;

       this.ie4=(document.all && !this.dom && !this.opera5)?1:0;

       this.ie=this.ie4||this.ie5||this.ie6

       this.mac=this.agent.indexOf("Mac")>-1

       this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;

       this.ns4=(document.layers && !this.dom)?1:0;

       this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)

       return this

}

var bw=new lib_bwcheck()

 

/*** variables to configure... ***/

 

var numScrollPages = 4         //Set the number of pages (layers) here.

var transitionOut = 1;         //The 'out' effect... 0= no effect, 1= fade

var transitionIn = 1;          //The 'in' effect... 0= no effect, 1= fade, 2= slide

var slideAcceleration = 0.2;   //If you use the slide animation, set this somewhere between 0 and 1.

 

if(document.layers){ //NS4 resize fix...

       scrX= innerWidth; scrY= innerHeight;

       onresize= function(){if(scrX!= innerWidth || scrY!= innerHeight){history.go(0)} }

}

function scrollerobj(obj,nest){

       nest = (!nest)?"":'document.'+nest+'.'

       this.elm = bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):document.getElementById(obj)

       this.css = bw.ns4?this.elm:this.elm.style

       this.doc = bw.ns4?this.elm.document:document

       this.obj = obj+'scrollerobj'; eval(this.obj+'=this')

       this.x = (bw.ns4||bw.opera5)?this.css.left:this.elm.offsetLeft

       this.y = (bw.ns4||bw.opera5)?this.css.top:this.elm.offsetTop

       this.w = (bw.ie4||bw.ie5||bw.ie6||bw.ns6)?this.elm.offsetWidth:bw.ns4?this.elm.clip.width:bw.opera5?this.css.pixelWidth:0

       this.h = (bw.ie4||bw.ie5||bw.ie6||bw.ns6)?this.elm.offsetHeight:bw.ns4?this.elm.clip.height:bw.opera5?this.css.pixelHeight:0

}

//object methods...

scrollerobj.prototype.moveTo = function(x,y){

       if(x!=null){this.x=x; this.css.left=x}

       if(y!=null){this.y=y; this.css.top=y}

}

scrollerobj.prototype.moveBy = function(x,y){this.moveTo(this.x+x,this.y+y)}

scrollerobj.prototype.hideIt = function(){this.css.visibility='hidden'}

scrollerobj.prototype.showIt = function(){this.css.visibility='visible'}

 

/****************************************************************/

 

var onlineormyefile = 1;

var activePage = null;

var busy = 0;

function activate(num){

       if (activePage!=pages[num] && !busy){

              busy = 1;

              if (transitionOut==0 || !bw.opacity){ activePage.hideIt(); activateContinue(num); }

              else if (transitionOut==1) activePage.blend('hidden', 'activateContinue('+num+')');

       }

}

function activateContinue(num){

       busy = 1;

       activePage = pages[num];

       activePage.moveTo(0,0);

       if (transitionIn==0 || !bw.opacity){ activePage.showIt(); busy=0; }

       else if (transitionIn==1) {

              activePage.blend('visible', 'busy=0');

       }

       else if (transitionIn==3) { activePage.slide(0, slideAcceleration, 40, 'busy=0'); }

       //==== 调用变换过程====

       startshow(num)

}

 

//============ 变换设置 ==========

function startshow(num){

       if (num == 1) 

              { num = 2; }

       else

              if (num == 2)

                     { num = 3; }

              else

                     if (num == 3)

                            { num = 4; }

                     else

                            if (num == 4)

                                   { num = 1; }

       setTimeout('activate('+num+')',1000);

}

 

scrollerobj.prototype.blend= function(vis, fn){

       if (bw.ie5||bw.ie6 && !bw.mac) {

              if (vis=='visible') this.css.filter= 'blendTrans(duration=0.9)';

              else this.css.filter= 'blendTrans(duration=0.6)';

              this.elm.onfilterchange = function(){ eval(fn); };

              this.elm.filters.blendTrans.apply();

              this.css.visibility= vis;

              this.elm.filters.blendTrans.play();

       }

       else if (bw.ns6 || bw.ie&&!bw.mac){

              this.css.visibility= 'visible';

              vis=='visible' ? this.fadeTo(100, 7, 40, fn) : this.fadeTo(0, 9, 40, fn);

       }

       else {

              this.css.visibility= vis;

              eval(fn);

       }

};

 

 

var pageslidefadeLoaded = 0;

function initPageSlideFade(){

       scroller1 = new scrollerobj('divScroller1');

      

       pages = new Array();

       pages[0] = null;

       for (var i=1; i<=numScrollPages; i++){

              pages[i] = new scrollerobj('dynPage'+i, 'divScroller1');

              pages[i].moveTo(0,0);

       }

       bw.opacity = ( bw.ie && !bw.ie4 && navigator.userAgent.indexOf('Windows')>-1 ) || bw.ns6

       if (bw.ie5||bw.ie6 && !bw.mac) pages[1].css.filter= 'blendTrans(duration=0.6)'; // Loads the windows 9.x filters module.

       activateContinue(1);

 

       //if (bw.ie) for(var i=0;i<document.links.length;i++) document.links[i].onfocus=document.links[i].blur;

       pageslidefadeLoaded = 1;

}

//if the browser is ok, the script is started onload..

if(bw.bw && !pageslidefadeLoaded) onload = initPageSlideFade;

</script>

      <div id=divScroller1>

        <div class=dynPage id=dynPage1><img src="120021114.gif" width="438" height="278"></div>

        <div class=dynPage id=dynPage2><img src="220021114.gif" width="438" height="278"></div>

        <div class=dynPage id=dynPage3><img src="320021114.gif" width="438" height="278"></div>

        <div class=dynPage id=dynPage4><img src="420021114.gif" width="438" height="278"></div>

      </div>

 

Write a comment

Comments: 0