El sitio más completo sobre programación, recursos web y herramientas online para Webmasters
Fecha: 24/01/2003

text effects zoom javascript

este javascript genera un efecto de zoom con el texto que designemos

Código Javascript


<HTML>
<HEAD>
<TITLE>text effects zoom</TITLE>
<meta name="Author" content="Thomas Brattli (roskilde@bratta.com)">
<meta name="KeyWords" content="DHTML, HTML, dhtml, html, demos, Javascript, VBscript, , Zoomtext, fadetext, Crossbrowser, Netscape4.0, IE4.0, Internet explorer, Dynamic HTML">
<meta name="Description" content="Crossbrowser Dynamic HTML zoomtext, fadetext, change colors of text!!!">
<script language="JavaScript" type="text/javascript">
/* Este script fue hecho por Bratta en www.bratta.com y puede ser usado
gratuitamente siempre que se deje este mensaje (en Ingles) intacto.
Agradecere los enlaces a mi pagina
Si quiere que el texto aparezca en otra parte de la pagina entonces
modifique el estilo del TAG.
Variables:
Primero el texto: */
text=new Array('Bienvenidos','a el','Sitio','de','Gabriel Marcelo','Rodríguez')
// numero de textos
var numText=6

// colores:
// el primer colos sera el color del texto cuando hace el zoom
color=new Array('#E8E8E8','#C2C2C2','#8E8E8E','#424242','#202020')

// numero de colores
var numColors=5

//tama¤o del zoom al finalizar
var endSize=70
//Velocidad del zoom (en milisegundos)
var Zspeed=30
//Velocidad de cambio en los colores
var Cspeed=200
//Fuente
var font='Arial Black'

// Esconder el texto cuando acaba el zoom? (true o false)
var hide=true


// Texto original
/*This script is made by bratta at www.bratta.com and can be used freely
as long as this msg is instact. I would appriciate any links to my page.
########################################################################
########################################################################
########################################################################
If you want the text to appear differently on anothe place on the page
or anything set that in the style tag of the zoom layer.
Here are the variables you have to set:
First the text: (it will stop and fade/change the colors on the last one)
text=new Array('www','bratta','com','www.bratta.com')

set the number of text's
var numText=4

Now the colors:
all you have to do is set the color you want to have in here:
(the first color will be the color that the text is when it zooms.)
color=new Array('#E8E8E8','#C2C2C2','#8E8E8E','#424242','#202020')

set the number of colors:
var numColors=5

set the size you want the zoom to end at:
var endSize=70
Set the speed you want it to zoom in (in milliseconds)
var Zspeed=30
Set the speed you want it too change colors in
var Cspeed=200
Set font
var font='Arial Black'

do you want it to hide when its done? (true or false)
var hide=true

You shouldn't really have to set anything below this point
######################################################################
######################################################################
######################################################################*/

var size=10
var gonum=0
/*Browsercheck and settings vars
######################################################################*/
if (document.all) {
n=0
ie=1
zoomText='document.all.zoom.innerText=text[num]'
zoomSize='document.all.zoom.style.fontSize=size'
closeIt=""
fadeColor="document.all.zoom.style.color=color[num]"
}
if (document.layers) {
n=1;ie=0
zoomText=""
zoomSize="document.zoom.document.write('<p align=\"center\" style=\"font-family:'+font+'; font-size:'+size+'px; color:'+color[0]+'\">'+text[num]+'</p>')"
closeIt="document.zoom.document.close()"
fadeColor="document.zoom.document.write('<p align=\"center\" style=\"font-family:'+font+'; font-size:'+endSize+'px; color:'+color[num]+'\">'+text[numText-1]+'</p>')"
}
/*The functions for zooming text.
####################################################################*/
function zoom(num,fn){
if (size<endSize){
eval(zoomText)
eval(zoomSize)
eval(closeIt)
size+=5;
setTimeout("zoom("+num+",'"+fn+"')",Zspeed)
}else{
eval(fn);
}
}
/*The functions for fading/changing colors on text
####################################################################*/
function fadeIt(num){
if (num<numColors){
eval(fadeColor)
eval(closeIt)
num+=1;
setTimeout("fadeIt("+num+")",Cspeed)
}else{
hideIt()
}
}
/*This is the function that hides the layer after the zoom/color change
####################################################################*/
function hideIt(){
if(hide){
if(ie)document.all.zoom.style.visibility="hidden"
if(n)document.layers.zoom.visibility="hidden"
}
}
/*This is the functions that calls the right function...or something :}
####################################################################*/
function init(){
if(ie){
document.all.zoom.style.color=color[0]
document.all.zoom.style.fontFamily=font}
go(0)
}
function go(num){
gonum+=1
size=10
if(num<numText){
zoom(num,'go('+gonum+')')
}else{
fadeIt(0)
}
}
//####################################################################
</script>
</HEAD>
<BODY onload="init()" bgcolor="Black" text="White" link="White">
<!-- Este es el zoom, para cambiar la apariencia cambia el parametro
que desees. Recuerda que solo puedes cambiar width, top, height,
left -->
<div id="zoom" align="center" style="position: absolute; top: 150; left: 12; width: 742; height: 19"></div>
<center>
<H1> </H1>
</center>
</BODY>
</HTML>

text effects zoom javascript Categoría: Javascript, Efectos texto

Compartir text effects zoom javascript en Facebook Twitter MySpace del.icio.us fresqui Meneame


Scripts Similares:

» text effects watermark javascript
» text animator javascript
» text blinker javascript
» javascript Botones con relieve
» text javascript effects fade
» javascript Top Animacion
Ver el perfil de Gabriel Marcelo Rodriguez en LinkedIn

Privacidad ּ Publicidad ּ Prensa ּ Premios ּ Colaborar ּ Enlazarnos ּ Mapa del Sitio ּ Aviso legal ּ Boletín ּ Contacto
2001 - 2011 | Sitio Sitio creado y mantenido por Gabriel Marcelo Rodriguez
Hosting de alta calidad a bajo costo Neolo.com.ar