nota automatica

martes, 28 de febrero de 2012

Scroll de bienvenida en el blog

Este scroll de bienvenida está hecho a base de un script que hará que se muestren líneas de mensajes con las letras apareciendo como si se estuvieran redactando con una máquina de escribir.
Sólo entra a Diseño > Elementos de la página y en un elemento HTML/Javascript pega lo siguiente:
<script language="javascript" type="text/javascript">

//Secify scroller contents
var line=new Array()
line[1]="Este es un scroll muy útil para dar la bienvenida..."
line[2]="Y motrar noticias relevantes a tus lectores..."
line[3]="Puedes configurarlo para poner el mensaje que quieras..."
line[4]="Quieres uno...?"
line[5]="CiudadBlogger.com"
line[6]="..."

//Specify font size for scoller
var ts_fontsize="12px"

//--Don't edit below this line

var longestmessage=1
for (i=2;i<line.length;i++){
if (line[i].length>line[longestmessage].length)
longestmessage=i
}

//Auto set scroller width
var tscroller_width=line[longestmessage].length

lines=line.length-1 //--Number of lines

//if IE 4+ or NS6
if (document.all||document.getElementById){
document.write('<form name="bannerform">')
document.write('<input type="text" name="banner" size="'+tscroller_width+'"')
document.write(' style="background-color: '+document.bgColor+'; color:#000000; font-family: verdana; font-size: '+ts_fontsize+'; font-weight:bold; border: medium none" onfocus="blur()">')
document.write('</form>')
}

temp=""
nextchar=-1;
nextline=1;
cursor="]"
function animate(){
if (temp==line[nextline] & temp.length==line[nextline].length & nextline!=lines){
nextline++;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",3000)}
else if (nextline==lines & temp==line[nextline] & temp.length==line[nextline].length){
nextline=1;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",1000)}
else{
nextstep()}}

function nextstep(){

if (cursor=="\\"){
cursor="|"}
else if (cursor=="|"){
cursor="/"}
else if (cursor=="/"){
cursor="-"}
else if (cursor=="-"){
cursor="\\"}


nextchar++;
temp+=line[nextline].charAt(nextchar);
document.bannerform.banner.value=temp+cursor
setTimeout("animate()",25)}

//if IE 4+ or NS6
if (document.all||document.getElementById)
window.onload=animate
</script>

Cambia lo que está en color rojo por el mensaje que quieras. Si necesitas más líneas de mensaje sólo agrega una igual usando un número consecutivo (7,8,9,etc.)
Para modificar el tiempo que tarda cada mensaje cambia el número 3000 que está en verde, en este caso 3000 representa 3 segundos, si deseas más tiempo sólo modifica en milisegundos el tiempo que deseas.
Lo que está en color azul es el color del texto, puedes cambiarlo por el que quieras. Imprimir artículo

No hay comentarios:

Publicar un comentario

Mil Trucos Blogger