How to add CSS to this JS?
Hello,
As I mentioned in this post: http://www.webdeveloper.com/forum/sh...bar-is-pressed, I am a beginner at JS, and I want to add CSS to the piece of code vwphillips gave me
PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
</head>
<body>
<span id="tst" >Word</span>
<script type="text/javascript">
function zxcFadeWord(o){
this.obj=document.getElementById(o.ID);
this.ary=o.WordArray;
this.ms=o.FadeDuration;
this.fin=o.FadeIn;
this.fout=o.FadeOut;
this.cnt=0;
this.run=true;
this.addevt(document,'keypress','space');
this.addevt(document,'keydown','space');
}
zxcFadeWord.prototype={
space:function(e){
var char=e.which?e.which:event.keyCode ;
if (char==32&&this.run){
this.run=false;
clearTimeout(this.dly);
this.fade(this.obj,this.fin,this.fout,new Date(),this.ms,true);
}
},
fade:function(obj,f,t,srt,mS,nxt){
var oop=this,ms=new Date().getTime()-srt,now=[],z0=0//=(t-f)/mS*ms+f;
for (;z0<3;z0++){
now[z0]=Math.round((t[z0]-f[z0])/mS*ms+f[z0]);
}
if (isFinite(now[0])&&isFinite(now[1])&&isFinite(now[2])){
obj.style.color='rgb('+now[0]+','+now[1]+','+now[2]+')';
}
if (ms<mS){
oop.dly=setTimeout(function(){ oop.fade(obj,f,t,srt,mS,nxt); },10);
}
else {
obj.style.color='rgb('+t[0]+','+t[1]+','+t[2]+')';
if (nxt){
obj.innerHTML=oop.ary[oop.cnt];
oop.fade(obj,oop.fout,oop.fin,new Date(),this.ms,false);
oop.cnt=++oop.cnt%oop.ary.length;
}
else {
oop.run=true;
}
}
},
addevt:function(o,t,f,p){
var oop=this;
if (o.addEventListener){
o.addEventListener(t,function(e){ return oop[f](e,p);}, false);
}
else if (o.attachEvent){
o.attachEvent('on'+t,function(e){ return oop[f](e,p); });
}
}
}
new zxcFadeWord({
ID:'tst',
WordArray:['Tom','Dick','Harry'],
FadeIn:[0,0,0],
FadeOut:[255,255,255],
FadeDuration:1000
});
</script>
</body>
</html>
The CSS I want to add is this:
PHP Code:
<style type="text/css">
body
{
background-color:#FFFFFF;
}
h1
{
color:#999999;
text-align:center;
font-family:"Cambria";
font-size:40px;
}
p
{
text-align:center;
font-family:"Cambria";
font-size:20px;
}
</style>
however, it doesn't work when I add it into the first piece of code.
Any help would be appreciated, thank you all!
