您当前的位置：飞翔学院-IT中国 → 编程开发 → JavaScript → 文章内容
COOL文本滚动区域

作者:佚名来源:不详发布时间:2008-5-23 9:03:16
<SCRIPT language=JavaScript>function DynLayer(id,nestref,frame) {if (!is.ns5 && !DynLayer.set && !frame) DynLayerInit()this.frame = frame || selfif (is.ns) {if (is.ns4) {if (!frame) {if (!nestref) var nestref = DynLayer.nestRefArray[id]if (!DynLayerTest(id,nestref)) returnthis.css = (nestref)? eval("document."+nestref+".document."+id) : document.layers[id]}else this.css = (nestref)? eval("frame.document."+nestref+".document."+id) : frame.document.layers[id]this.elm = this.event = this.cssthis.doc = this.css.document}else if (is.ns5) {this.elm = document.getElementById(id)this.css = this.elm.stylethis.doc = document}this.x = this.css.leftthis.y = this.css.topthis.w = this.css.clip.widththis.h = this.css.clip.height}else if (is.ie) {this.elm = this.event = this.frame.document.all[id]this.css = this.frame.document.all[id].stylethis.doc = documentthis.x = this.elm.offsetLeftthis.y = this.elm.offsetTopthis.w = (is.ie4)? this.css.pixelWidth : this.elm.offsetWidththis.h = (is.ie4)? this.css.pixelHeight : this.elm.offsetHeight}this.id = idthis.nestref = nestrefthis.obj = id + "DynLayer"eval(this.obj + "=this")}function DynLayerMoveTo(x,y) {if (x!=null) {this.x = xif (is.ns) this.css.left = this.xelse this.css.pixelLeft = this.x}if (y!=null) {this.y = yif (is.ns) this.css.top = this.yelse this.css.pixelTop = this.y}}function DynLayerMoveBy(x,y) {this.moveTo(this.x+x,this.y+y)}function DynLayerShow() {this.css.visibility = (is.ns4)? "show" : "visible"}function DynLayerHide() {this.css.visibility = (is.ns4)? "hide" : "hidden"}DynLayer.prototype.moveTo = DynLayerMoveToDynLayer.prototype.moveBy = DynLayerMoveByDynLayer.prototype.show = DynLayerShowDynLayer.prototype.hide = DynLayerHideDynLayerTest = new Function('return true')// DynLayerInit Functionfunction DynLayerInit(nestref) {if (!DynLayer.set) DynLayer.set = trueif (is.ns) {if (nestref) ref = eval('document.'+nestref+'.document')else {nestref = ''; ref = document;}for (var i=0; i<ref.layers.length; i++) {var divname = ref.layers[i].nameDynLayer.nestRefArray[divname] = nestrefvar index = divname.indexOf("Div")if (index > 0) {eval(divname.substr(0,index)+' = new DynLayer("'+divname+'","'+nestref+'")')}if (ref.layers[i].document.layers.length > 0) {DynLayer.refArray[DynLayer.refArray.length] = (nestref=='')? ref.layers[i].name : nestref+'.document.'+ref.layers[i].name}}if (DynLayer.refArray.i < DynLayer.refArray.length) {DynLayerInit(DynLayer.refArray[DynLayer.refArray.i++])}}else if (is.ie) {for (var i=0; i<document.all.tags("DIV").length; i++) {var divname = document.all.tags("DIV")[i].idvar index = divname.indexOf("Div")if (index > 0) {eval(divname.substr(0,index)+' = new DynLayer("'+divname+'")')}}}return true}DynLayer.nestRefArray = new Array()DynLayer.refArray = new Array()DynLayer.refArray.i = 0DynLayer.set = false// Slide Methodsfunction DynLayerSlideTo(endx,endy,inc,speed,fn) {if (endx==null) endx = this.xif (endy==null) endy = this.yvar distx = endx-this.xvar disty = endy-this.ythis.slideStart(endx,endy,distx,disty,inc,speed,fn)}function DynLayerSlideBy(distx,disty,inc,speed,fn) {var endx = this.x + distxvar endy = this.y + distythis.slideStart(endx,endy,distx,disty,inc,speed,fn)}function DynLayerSlideStart(endx,endy,distx,disty,inc,speed,fn) {if (this.slideActive) returnif (!inc) inc = 10if (!speed) speed = 20var num = Math.sqrt(Math.pow(distx,2) + Math.pow(disty,2))/incif (num==0) returnvar dx = distx/numvar dy = disty/numif (!fn) fn = nullthis.slideActive = truethis.slide(dx,dy,endx,endy,num,1,speed,fn)}function DynLayerSlide(dx,dy,endx,endy,num,i,speed,fn) {if (!this.slideActive) returnif (i++ < num) {this.moveBy(dx,dy)this.onSlide()if (this.slideActive) setTimeout(this.obj+".slide("+dx+","+dy+","+endx+","+endy+","+num+","+i+","+speed+",\""+fn+"\")",speed)else this.onSlideEnd()}else {this.slideActive = falsethis.moveTo(endx,endy)this.onSlide()this.onSlideEnd()eval(fn)}}function DynLayerSlideInit() {}DynLayer.prototype.slideInit = DynLayerSlideInitDynLayer.prototype.slideTo = DynLayerSlideToDynLayer.prototype.slideBy = DynLayerSlideByDynLayer.prototype.slideStart = DynLayerSlideStartDynLayer.prototype.slide = DynLayerSlideDynLayer.prototype.onSlide = new Function()DynLayer.prototype.onSlideEnd = new Function()// Clip Methodsfunction DynLayerClipInit(clipTop,clipRight,clipBottom,clipLeft) {if (is.ie) {if (arguments.length==4) this.clipTo(clipTop,clipRight,clipBottom,clipLeft)else if (is.ie4) this.clipTo(0,this.css.pixelWidth,this.css.pixelHeight,0)}}function DynLayerClipTo(t,r,b,l) {if (t==null) t = this.clipValues('t')if (r==null) r = this.clipValues('r')if (b==null) b = this.clipValues('b')if (l==null) l = this.clipValues('l')if (is.ns) {this.css.clip.top = tthis.css.clip.right = rthis.css.clip.bottom = bthis.css.clip.left = l}else if (is.ie) this.css.clip = "rect("+t+"px "+r+"px "+b+"px "+l+"px)"}function DynLayerClipBy(t,r,b,l) {this.clipTo(this.clipValues('t')+t,this.clipValues('r')+r,this.clipValues('b')+b,this.clipValues('l')+l)}function DynLayerClipValues(which) {if (is.ie) var clipv = this.css.clip.split("rect(")[1].split(")")[0].split("px")if (which=="t") return (is.ns)? this.css.clip.top : Number(clipv[0])if (which=="r") return (is.ns)? this.css.clip.right : Number(clipv[1])if (which=="b") return (is.ns)? this.css.clip.bottom : Number(clipv[2])if (which=="l") return (is.ns)? this.css.clip.left : Number(clipv[3])}DynLayer.prototype.clipInit = DynLayerClipInitDynLayer.prototype.clipTo = DynLayerClipToDynLayer.prototype.clipBy = DynLayerClipByDynLayer.prototype.clipValues = DynLayerClipValues// Write Methodfunction DynLayerWrite(html) {if (is.ns) {this.doc.open()this.doc.write(html)this.doc.close()}else if (is.ie) {this.event.innerHTML = html}}DynLayer.prototype.write = DynLayerWrite// BrowserCheck Objectfunction BrowserCheck() {var b = navigator.appNameif (b=="Netscape") this.b = "ns"else if (b=="Microsoft Internet Explorer") this.b = "ie"else this.b = bthis.version = navigator.appVersionthis.v = parseInt(this.version)this.ns = (this.b=="ns" && this.v>=4)this.ns4 = (this.b=="ns" && this.v==4)this.ns5 = (this.b=="ns" && this.v==5)this.ie = (this.b=="ie" && this.v>=4)this.ie4 = (this.version.indexOf('MSIE 4')>0)this.ie5 = (this.version.indexOf('MSIE 5')>0)this.min = (this.ns||this.ie)}is = new BrowserCheck()// CSS Functionfunction css(id,left,top,width,height,color,vis,z,other) {if (id=="START") return '<STYLE TYPE="text/css">\n'else if (id=="END") return '</STYLE>'var str = (left!=null && top!=null)? '#'+id+' {position:absolute; left:'+left+'px; top:'+top+'px;' : '#'+id+' {position:relative;'if (arguments.length>=4 && width!=null) str += ' width:'+width+'px;'if (arguments.length>=5 && height!=null) {str += ' height:'+height+'px;'if (arguments.length<9 || other.indexOf('clip')==-1) str += ' clip:rect(0px '+width+'px '+height+'px 0px);'}if (arguments.length>=6 && color!=null) str += (is.ns)? ' layer-background-color:'+color+';' : ' background-color:'+color+';'if (arguments.length>=7 && vis!=null) str += ' visibility:'+vis+';'if (arguments.length>=8 && z!=null) str += ' z-index:'+z+';'if (arguments.length==9 && other!=null) str += ' '+otherstr += '}\n'return str}function writeCSS(str,showAlert) {str = css('START')+str+css('END')document.write(str)if (showAlert) alert(str)}</SCRIPT><SCRIPT language=JavaScript>function MiniScroll(window,content) {this.window = windowthis.content = contentthis.inc = 8this.speed = 20this.contentHeight = (is.ns)? this.content.doc.height : this.content.elm.scrollHeightthis.contentWidth = (is.ns)? this.content.doc.width : this.content.elm.scrollWidththis.up = MiniScrollUpthis.down = MiniScrollDownthis.left = MiniScrollLeftthis.right = MiniScrollRightthis.stop = MiniScrollStopthis.activate = MiniScrollActivatethis.activate(this.contentWidth,this.contentHeight)}function MiniScrollActivate() {this.offsetHeight = this.contentHeight-this.window.hthis.offsetWidth = this.contentWidth-this.window.wthis.enableVScroll = (this.offsetHeight>0)this.enableHScroll = (this.offsetWidth>0)}function MiniScrollUp() {if (this.enableVScroll) this.content.slideTo(null,0,this.inc,this.speed)}function MiniScrollDown() {if (this.enableVScroll) this.content.slideTo(null,-this.offsetHeight,this.inc,this.speed)}function MiniScrollLeft() {if (this.enableHScroll) this.content.slideTo(0,null,this.inc,this.speed)}function MiniScrollRight() {if (this.enableHScroll) this.content.slideTo(-this.offsetWidth,null,this.inc,this.speed)}function MiniScrollStop() {this.content.slideActive = false}</SCRIPT><SCRIPT language=JavaScript><!--function init() {pulloutContent = new Array()pulloutWindow = new Array()pulloutScroll = new Array()for (var i=0;i<=4;i++) {pulloutContent[i] = new DynLayer('pullout'+i+'Content')pulloutWindow[i] = new DynLayer('pullout'+i+'Window')pulloutWindow[i].slideInit()pulloutScroll[i] = new MiniScroll(pulloutWindow[i],pulloutContent[i])}pulloutShown = 0}function pulloutStart(i) {if (i!=pulloutShown) {pulloutActive = truepulloutWindow[pulloutShown].slideTo(-285,null,15,15,'pulloutEnd('+i+')')}}function pulloutEnd(i) {pulloutShown = ipulloutWindow[i].slideTo(0,null,15,15,'pulloutActive==false')}//--></SCRIPT><STYLE type=text/css>A {FONT-SIZE: 10pt; COLOR: #000000; FONT-FAMILY: 'Arial'}A.scroll {COLOR: #ffffff}STRONG {FONT-WEIGHT: bold; FONT-SIZE: 15pt; LINE-HEIGHT: 25pt; FONT-FAMILY: 'Arial'}P {FONT-SIZE: 10pt; LINE-HEIGHT: 13pt; FONT-FAMILY: 'Arial'}#pulloutInterface {LEFT: 50px; WIDTH: 400px; CLIP: rect(0px 400px 250px 0px); POSITION: absolute; TOP: 50px; HEIGHT: 250px; BACKGROUND-COLOR: #000000; layer-background-color: #000000}#pullout0Sidebar {LEFT: 5px; WIDTH: 100px; CLIP: rect(0px 100px 30px 0px); POSITION: absolute; TOP: 5px; HEIGHT: 30px; BACKGROUND-COLOR: #dedede; layer-background-color: #DEDEDE}#pullout1Sidebar {LEFT: 5px; WIDTH: 100px; CLIP: rect(0px 100px 30px 0px); POSITION: absolute; TOP: 40px; HEIGHT: 30px; BACKGROUND-COLOR: #c5c5c5; layer-background-color: #C5C5C5}#pullout2Sidebar {LEFT: 5px; WIDTH: 100px; CLIP: rect(0px 100px 30px 0px); POSITION: absolute; TOP: 75px; HEIGHT: 30px; BACKGROUND-COLOR: #a2a2a2; layer-background-color: #A2A2A2}#pullout3Sidebar {LEFT: 5px; WIDTH: 100px; CLIP: rect(0px 100px 30px 0px); POSITION: absolute; TOP: 110px; HEIGHT: 30px; BACKGROUND-COLOR: #7e7e7e; layer-background-color: #7E7E7E}#pullout4Sidebar {LEFT: 5px; WIDTH: 100px; CLIP: rect(0px 100px 30px 0px); POSITION: absolute; TOP: 145px; HEIGHT: 30px; BACKGROUND-COLOR: #7e7e7e; layer-background-color: #7E7E7E}#pulloutUpDown {LEFT: 5px; POSITION: absolute; TOP: 200px}#pulloutViewArea {LEFT: 110px; WIDTH: 285px; CLIP: rect(0px 285px 240px 0px); POSITION: absolute; TOP: 5px; HEIGHT: 240px; BACKGROUND-COLOR: #000000; layer-background-color: #000000}#pullout0Window {LEFT: 0px; WIDTH: 285px; CLIP: rect(0px 285px 240px 0px); POSITION: absolute; TOP: 0px; HEIGHT: 240px; BACKGROUND-COLOR: #dedede; layer-background-color: #DEDEDE}#pullout0Content {LEFT: 5px; WIDTH: 275px; POSITION: absolute; TOP: 0px}#pullout1Window {LEFT: -285px; WIDTH: 285px; CLIP: rect(0px 285px 240px 0px); POSITION: absolute; TOP: 0px; HEIGHT: 240px; BACKGROUND-COLOR: #c5c5c5; layer-background-color: #C5C5C5}#pullout1Content {LEFT: 5px; WIDTH: 275px; POSITION: absolute; TOP: 0px}#pullout2Window {LEFT: -285px; WIDTH: 285px; CLIP: rect(0px 285px 240px 0px); POSITION: absolute; TOP: 0px; HEIGHT: 240px; BACKGROUND-COLOR: #a2a2a2; layer-background-color: #A2A2A2}#pullout2Content {LEFT: 5px; WIDTH: 275px; POSITION: absolute; TOP: 0px}#pullout3Window {LEFT: -285px; WIDTH: 285px; CLIP: rect(0px 285px 240px 0px); POSITION: absolute; TOP: 0px; HEIGHT: 240px; BACKGROUND-COLOR: #7e7e7e; layer-background-color: #7E7E7E}#pullout3Content {LEFT: 5px; WIDTH: 275px; POSITION: absolute; TOP: 0px}#pullout4Window {LEFT: -285px; WIDTH: 285px; CLIP: rect(0px 285px 240px 0px); POSITION: absolute; TOP: 0px; HEIGHT: 240px; BACKGROUND-COLOR: #7e7e7e; layer-background-color: #7E7E7E}#pullout4Content {LEFT: 5px; WIDTH: 275px; POSITION: absolute; TOP: 0px}</STYLE><DIV id=pulloutInterface><DIV id=pullout0Sidebar><P align=center><A href="javascript:pulloutStart(0)">第一页</A></P></DIV><DIV id=pullout1Sidebar><P align=center><A href="javascript:pulloutStart(1)">第二页</A></P></DIV><DIV id=pullout2Sidebar><P align=center><A href="javascript:pulloutStart(2)">第三页</A></P></DIV><DIV id=pullout3Sidebar><P align=center><A href="javascript:pulloutStart(3)">第四页</A></P></DIV><DIV id=pullout4Sidebar><P align=center><A href="javascript:pulloutStart(4)">第五页</A></P></DIV><DIV id=pulloutUpDown><A onmouseup=pulloutScroll[pulloutShown].stop() class=scroll onmousedown=pulloutScroll[pulloutShown].up() onmouseout=pulloutScroll[pulloutShown].stop() href="javascript://%20Scroll%20Up">向上</A> <BR><A onmouseup=pulloutScroll[pulloutShown].stop() class=scroll onmousedown=pulloutScroll[pulloutShown].down() onmouseout=pulloutScroll[pulloutShown].stop() href="javascript://%20Scroll%20Down">向下</A> </DIV><DIV id=pulloutViewArea><DIV id=pullout0Window><DIV id=pullout0Content><DIV align=center><STRONG>第一页</STRONG></DIV><TABLE width=275 border=0>  <TBODY>  <TR>    <TD>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P></TD></TR></TBODY></TABLE></DIV></DIV><DIV id=pullout1Window><DIV id=pullout1Content><DIV align=center><STRONG>第二页</STRONG></DIV><TABLE width=275 border=0>  <TBODY>  <TR>    <TD>      <P>This is item number 1. This text is here to fill up space. This is item       number 1. This text is here to fill up space. This is item number 1. This       text is here to fill up space. This is item number 1. This text is here to       fill up space.</P>      <P>This is item number 1. This text is here to fill up space. This is item       number 1. This text is here to fill up space. This is item number 1. This       text is here to fill up space. This is item number 1. This text is here to       fill up space.</P>      <P>This is item number 1. This text is here to fill up space. This is item       number 1. This text is here to fill up space. This is item number 1. This       text is here to fill up space. This is item number 1. This text is here to       fill up space.</P>      <P>This is item number 1. This text is here to fill up space. This is item       number 1. This text is here to fill up space. This is item number 1. This       text is here to fill up space. This is item number 1. This text is here to       fill up space.</P>      <P>This is item number 1. This text is here to fill up space. This is item       number 1. This text is here to fill up space. This is item number 1. This       text is here to fill up space. This is item number 1. This text is here to       fill up space.</P>      <P>This is item number 1. This text is here to fill up space. This is item       number 1. This text is here to fill up space. This is item number 1. This       text is here to fill up space. This is item number 1. This text is here to       fill up space.</P></TD></TR></TBODY></TABLE></DIV></DIV><DIV id=pullout2Window><DIV id=pullout2Content><DIV align=center><STRONG>第三页</STRONG></DIV><TABLE width=275 border=0>  <TBODY>  <TR>    <TD>      <P>This is item number 2. This text is here to fill up space. This is item       number 2. This text is here to fill up space. This is item number 2. This       text is here to fill up space. This is item number 2. This text is here to       fill up space.</P>      <P>This is item number 2. This text is here to fill up space. This is item       number 2. This text is here to fill up space. This is item number 2. This       text is here to fill up space. This is item number 2. This text is here to       fill up space.</P>      <P>This is item number 2. This text is here to fill up space. This is item       number 2. This text is here to fill up space. This is item number 2. This       text is here to fill up space. This is item number 2. This text is here to       fill up space.</P>      <P>This is item number 2. This text is here to fill up space. This is item       number 2. This text is here to fill up space. This is item number 2. This       text is here to fill up space. This is item number 2. This text is here to       fill up space.</P>      <P>This is item number 2. This text is here to fill up space. This is item       number 2. This text is here to fill up space. This is item number 2. This       text is here to fill up space. This is item number 2. This text is here to       fill up space.</P>      <P>This is item number 2. This text is here to fill up space. This is item       number 2. This text is here to fill up space. This is item number 2. This       text is here to fill up space. This is item number 2. This text is here to       fill up space.</P></TD></TR></TBODY></TABLE></DIV></DIV><DIV id=pullout3Window><DIV id=pullout3Content><DIV align=center><STRONG>第四页</STRONG></DIV><TABLE width=275 border=0>  <TBODY>  <TR>    <TD>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P></TD></TR></TBODY></TABLE></DIV></DIV><DIV id=pullout4Window><DIV id=pullout4Content><DIV align=center><STRONG>第五页</STRONG></DIV><TABLE width=275 border=0>  <TBODY>  <TR>    <TD>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P>      <P>This is item number 0. This text is here to fill up space. This is item       number 0. This text is here to fill up space. This is item number 0. This       text is here to fill up space. This is item number 0. This text is here to       fill up space.</P></TD></TR></TBODY></TABLE></DIV></DIV></DIV></DIV><script>init();</script>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]
打印文档
推荐好友
返回顶部
增大字体
减少字体
COOL文本滚动区域

分类推荐

热点文章

精采文章

精采文章
