- Home Page
- > Script JavaScript
- > Script JavaScript Testo
- > Testo Sfumato
Testo Sfumato
Testo che cambia sfumando. (il testo è linkabile).
¤ Clicca qui per visualizzare la demo... ¤
<HTML>
<HEAD>
<TITLE>068</TITLE>
<style>
body{background-color:#FFFFFF}
A{color:Navy; text-decoration:none}
A:hover{color:red}
A:visited:{color:#808080}
TD{font-family:arial,helvetica; font-size:10pt}
</style>
<script language="JavaScript">
Browsercheck:*/
ie=document.all?1:0
n=document.layers?1:0
//The delay between the fades (in milliseconds) smaller value gives less time:
betweendelay=1000
//Do you wan't it to start over on the first one when it's gone trought all the news?
//(set to 0 if not)
var loop=1
//What font do you wan't it use?
FontFace='arial,helvetiva'
//What font-size (in pixel)?
FontSize=12
//Do you wan't it to fade out aswell? 1 for on, 0 for off
fadeback=1
//Set the colors, first color is same as background, last color is the color it stops at:
//You can have upto 7 colors, set the ones you wan't use to 0
colors=new Array()
colors[0]='#FFFFFF'
colors[1]='#EEEEEE'
colors[2]='#CCCCCC'
colors[3]='#999999'
colors[4]='#666666'
colors[5]='#333333'
colors[6]='#000000'
//This is the news you wanna have, set the link and the text. If you don't wan't it to link anywhere
//use a # as the link
news=new Array(new Array(),new Array())
news[0]["text"]="MorpheusWeb.it Risorse per webmaster"
news[0]["link"]="http://www.morpheusweb.it"
news[1]["text"]="Script, manuali, links, ASP, PHP, DHTML"
news[1]["link"]="http://www.morpheusweb.it"
/*Dont change anything below this!*/
fadeInit=new Function("oNews=new makeObj('divNews','divCont'); fadeNews(0)")
function makeObj(obj,nest)
{
nest=(!nest) ? '':'document.'+nest+'.'
this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')
this.writeref=(n) ? eval(nest+'document.'+obj+'.document'):eval(obj);
this.fadeIt=b_fadeIt
this.obj = obj + "Object"; eval(this.obj + "=this")
}
function b_fadeIt(text,link,font,size,speed,fn,num,c0,c1,c2,c3,c4,c5,c6)
{
if(num<arguments.length && arguments[num]!=0)
{
writetext='<a href="'+link+'" style="text-decoration:none; font-size:'+size+'px">'
+
'<font face="'+font+'" color="'+arguments[num]+'">'+text+'</font></a>'
if(n)
{
this.writeref.write(writetext);
this.writeref.close()
}
if(ie)
this.writeref.innerHTML=writetext
num++
setTimeout(this.obj+'.fadeIt("'+text+'","'+link+'","'+font+'",'+size+','+speed+',
"'+fn+'",'+num+',"'+c0+'","'+c1+'","'+c2+'","'+c3+'","'+c4+'",
"'+c5+'","'+c6+'")',speed)}else
setTimeout('eval('+fn+')',betweendelay)
}
function fadeNews(num)
{
if(num<news.length)
{
fn=fadeback?'fadeBack('+num+')':'fadeNews('+(num+1)+')';
oNews.fadeIt(news[num]["text"],news[num]["link"],FontFace,FontSize,100,fn,7,
colors[0],colors[1],colors[2],colors[3],colors[4],colors[5],colors[6])
}
else if(loop)
fadeNews(0)
}
function fadeBack(num)
{
if(num>=0)
{
oNews.fadeIt(news[num]["text"],news[num]["link"],FontFace,FontSize,100,'fadeNews('+(num+1) +
')',7,colors[6],colors[5],colors[4],colors[3],colors[2],colors[1],colors[0])
}
}
onload=fadeInit;
</script>
</HEAD>
<BODY bgcolor="white" >
<div id="divCont" style="position:absolute; width:250; height:200; left:200; top:180">
<div id="divNews" style="position:absolute">
<script>
if(document.all || document.layers)
document.write("dummy text, dummy"
+
"text, you can place you fist news or a welcome msg or something here."
+
"If you place these layers inside a table or something you can also"
+
"use this as the msg that browsers that doesn't suport dhtml will see.")
</script>
</div>
</div>
</body>
</html>
A colpo d'occhio
Be Responsive
HTML 5
HTML 5 è un linguaggio di markup utilizzato per la strutturazione e il contenuto delle pagine Web.
CSS 3
CSS 3 è l'ultima evoluzione dei fogli di stile CSS. Contiene molte novità come angoli arrotondati, ombre, sfumature, transizioni o animazioni.
jQuery
jQuery è una libreria JavaScript cross-platform progettata per semplificare lo scripting lato client.