字幕滚动效果文本特效__脚本特效_后台技术飞飞Asp技术乐园

字幕滚动效果

时间： 2007-10-03 21:26:17　阅读次数：2260

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>网页特效|www.ffasp.com 飞飞Asp乐园|---字幕滚动效果（二）</title>
</head>

<body>

//<![CDATA[

<!--

function scrollerObj(name,initH,initW,heightB,widthB,content,initBg,Bg,speed,initFl){

//**data**//

this.name=name;

this.initH=initH;

this.initW=initW;

this.heightB=heightB;

this.widthB=widthB;

this.content=content;

this.initBg=initBg;

this.Bg=Bg;

this.iniFl=initFl;

this.speed=parseInt(speed);

this.timer = name + "Timer";

this.elem;

//**methods**//

this.getElement = getElement;

this.createLayer=createLayer;

this.scrollLayer = scrollLayer;

this.scrollLoop=scrollLoop;

//**initiate methods**//

this.createLayer();

this.getElement();

this.scrollLayer();

}

//**call this method to stop scrolling**//

function scrollLoop(s){

this.speed = s;

}

//**pretty obvious**//

function scrollLayer(){

if(parseInt(this.elem.style.top)>(this.elem.offsetHeight*(-1))){

this.elem.style.top = parseInt(this.elem.style.top)-this.speed;

//alert(parseInt(this.elem.style.top)+"\n"+this.elem.id);

}

else {this.elem.style.top = this.initH;}

}

//**get the specific dom-expression**//

function getElement(){

if(document.getElementById){

this.elem = document.getElementById(this.name);

}

else if (document.all){

this.elem = document.all[name];

}

else if (document.layers){

this.elem = document.layers[name];

}

//**pretty obvious - if NS4 - please upgrade to a standard compliant browser**//

function createLayer(){

if(document.getElementById || document.all){

document.write('<div id="layer'+this.name+'" style="position:relative;overflow:hidden;float:'+this.initFl+';background-color:#'+this.initBg+';border:1px solid black;width:'+this.initW+'px;height:'+this.initH+'px;" onMouseover="'+this.name+'.scrollLoop(0)" onMouseout="'+this.name+'.scrollLoop('+this.speed+')">');

document.write('<div id="'+this.name+'" style="position:absolute;top:'+this.initH+'px;left:0px;border:0px solid black;width:'+this.widthB+'px;height:'+this.heightB+'px;background-color:#'+this.Bg+'">');

document.write(this.content);

document.write('<\/div><\/div>');}

else if(document.layers){

document.write('<ilayer name="'+this.name+'" bgcolor="#'+this.Bg+'" width="'+this.widthB+'" height="'+this.heightB+'">'+this.content+'<\/ilayer>');

return;

}

if(this.scrollLayer){

this.timer = setInterval(this.name+'.scrollLayer()','30');

}

//-->

//]]>

</script>

/*<![CDATA[*/

<!--

P{color:#465d5c;margin:3px;}

A{color:#e86500}

H1{color:#465d5c;font-size:11px;font-weight:normal;font-weight:bold;font-size:11px;font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;margin:3px; padding:0px}

H2{color:#465d5c;font-size:11px;font-weight:bold;font-size:11px;font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;margin:3px; padding:0px}

.art{font-weight:normal;font-size:11px;font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;width:100%;border-top:1px solid #FFFFFF;border-bottom:1px solid #FF7F00; padding:3px;margin-bottom:10px;text-align: justify;}

.state{color:#e86500;margin-left:5px;margin-right:5px;}

#art1{background-color:#FFBB00;}

#art2{background-color:#FFCC00;}

#art3{background-color:#FFDD00;}

#art4{background-color:#FFEE00;}

#main{background-image: url(img/bg_px_3.gif);background-color: #cc6600;width:600px;padding-bottom:75px;border:1px solid white}

#logo{margin-left:10px; margin-top:3px; margin-bottom:10px; font-weight:bold;font-size:11px;font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;width:100%;}

#date{font-size:9px; font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;color:#545454}

-->

/*]]>*/

</style>

//<![CDATA[

<!--

var c = new scrollerObj('c','300','100','50','100','<h1>滚动新闻<\/h1><p>This scroller code will allow you to put several newsboxes on your site. You can put any valid html in the box, including images.<\/p><p>Please note that when you put the ooscroller in a table, this will not work in Mozilla. When you hover your mouse over the box when running Mozilla: not working either. If anybody knows whats going on please <a href="mailto:webmaster@n.one.port5.com">mail me<\/a><\/p>','FFDD00','cccccc','2','center');//修改背景和滚动字幕的宽度、高度和颜色

//-->

//]]>

</script>

</div>

</body>

</html>

提示：您可以先修改部分代码再运行