![algunos trucos html y javascript para adornar tu web [2do]](https://storage.posteamelo.com/assets-adonis/assets/2013/10/08/970FCE47E.png-jBCxRKYIPZN.webp)
Muy buenas amigos,hoy les dejo la segunda parte de el post,con mas trucos html y javascript para personalizar tu web,y darle el uso que deseen,sin mas empecemos y espero que les guste.
Hora y texto en la barra de estado:
Con este truco, podemos hacer que aparezca en la barra de estado la hora de la PC que entra a nuestra Web y poner el texto que queramos.
<script language="JavaScript">
<!--
mensaje=" |======| www.tupagina.com "
function hora() {
var h = new Date();
window.status="|======| "
+ h.getHours() +":"+ h.getMinutes() +"" +mensaje ;
window.setTimeout('hora()',100);
}
hora()
//-->
</script>
Botón animado:
Aprende a dar movimiento a tu página con botones animados por Java Script. Cada botón puede llevar a un enlace distinto. Sólo tienes que configurar los parámetros "lineArr" y "urlArr" del script, que permiten destacar cosas en tu página.
<font face="Arial, Helvetica, sans-serif" size="2">
<script language="JavaScript">
var timerID = null
var timerRunning = false
var charNo = 0
var charMax = 0
var lineNo = 0
var lineMax = 3
var lineArr = new Array(lineMax)
var urlArr = new Array(lineMax)
lineArr[1] = "slogan"
urlArr[1] = "http://www.tupagina.com"
lineArr[2] = "Trucos PC"
urlArr[2] = "http://www.tupagina.com/direccion.htm"
lineArr[3] = "pagina"
urlArr[3] = "http://www.tupagina.com/noticias.htm"
var lineText = lineArr[1]
function StartShow() {
StopShow()
ShowLine()
timerRunning = true
}
function FillSpaces() {
for (var i = 1; i <= lineWidth; i++) {
spaces += " "
}
}
function StopShow() {
if (timerRunning) {
clearTimeout(timerID)
timerRunning = false
}
}
function ShowLine() {
if (charNo == 0) {
if (lineNo < lineMax) {
lineNo++
}
else {
lineNo = 1
}
lineText = lineArr[lineNo]
charMax = lineText.length
}
if (charNo <= charMax) {
document.formDisplay.buttonFace.value = lineText.substring(0, charNo)
charNo++
timerID = setTimeout("ShowLine()", 100)
}
else {
charNo = 0
timerID = setTimeout("ShowLine()", 3000)
}
}
function GotoUrl(url)
{
top.location.href = url
}
document.write("<form name="formDisplay">");
document.write("<input type="button" name="buttonFace" value="&{lineText}" size="18" onClick="GotoUrl(urlArr[lineNo])">");
document.write("</form>");
StartShow();
</script></font>
Botón Colorido:
¿Cansado del botón siempre gris? Ahora con CSS podés definir cualquier color para tus botones. Ellos combinarán más con tu página y son muy fáciles de crear.
Copia el código que sigue y pegalo dentro de la etiqueta de formulario de tu página:
<input type="submit" name="button" value="www.tupagina.com" style="color: #000000; background-color: #FF9900">
Página protegida por clave:
Este es un excelente recurso. Podés proteger tus páginas con una clave. Así podés definir exactamente quienes entrarán a tu página. No tenés que preocuparte por configuraciones. Es muy sencillo: la clave siempre será el nombre de tu página sin la extensión .htm, es decir, si la página tiene el nombre de "ejemplo.htm", la clave será "ejemplo". ¿Ves que fácil?.
Para tener este recurso en tu sitio debes incluir un código en la página de "entrada" en donde el visitante ingresará la clave, y enviar a tu sitio el archivo de la página que será cargada.
<Form name="frm">
<center>
<Script Language="JavaScript">
<!--
//
function loadpage(){
var psj=0;
newwin = window.open(document.frm.pswd.value + ".htm")
}
//-->
</script>
Ingresa tu clave:
<input
type="password" name="pswd" size="20">
</center>
<center>
<p>
<input type="button" value="Entra"
onClick="loadpage()" name="button">
</p>
</center>
</form>
Mensaje de bienvenida:
Con este recurso personalizas tu sitio para el visitante. Al entrar, el visitante verá un espacio para ingresar su nombre y un mensaje que dice "Hola, Fulano".
Copia el siguiente código y pégalo donde quieras que aparezca el mensaje:
<Script language="JavaScript">
mensagem = prompt("Por favor, ingresa tu nombre",'');
if (mensagem==null) {
document.write("¡Hola, visitante!")
}else{
if (mensagem=='') {
document.write("<b><font face=arial size=2 color=#000000>¡Hola, visitante!</font></b>")
}else{
document.write("<b><font face=arial size=2 color=#000000>¡Hola"+mensagem+"! Bienvenido a mi sitio</font></b>");
}
}
</script>
Atrás y Adelante:
Atrás:
<a href="javascript:history.go(-1)">Atrás </a>
Adelante:
<a href="javascript:history.go(1)">Adelante</a>
Barra de estado fija:
Puedes colocar la palabra o el mensaje que quieras en la barra de estado de tu sitio y mantenerlo fijo. De esta forma tu sitio quedará mucho más personalizado, además de contar con otras ventajas. Por ejemplo: el visitante no verá la dirección del enlace al que está apuntando, sólo el mensaje definido por ti.
<Script language="JavaScript">
statuss();
function statuss()
{
window.status = "www.tupagina.com una gran pagina.";
setTimeout("statuss()", 1);
}
</script>
Saludo al visitante:
Puedes poner en tu sitio un mensaje personalizado según la hora en que el visitante entre. Este puede recibir el saludo "Buen día", "Buenas tardes", "Buenas noches", o puedes sustituirlos por otros mensajes de tu preferencia. De esta forma el visitante verá el mensaje de acuerdo con el horario que entre a tu página.
<Font size=2 face=arial><b>
<Script Language="JavaScript">
<!--
today = new Date()
if(today.getMinutes() < 10){
pad = "0"}
else
pad = "";
document.write ;if((today.getHours() >=6) && (today.getHours() <=9)){
document.write("¡Buen día!")
}
if((today.getHours() >=10) && (today.getHours() <=11)){
document.write("¡Buen día!")
}
if((today.getHours() >=12) && (today.getHours() <=19)){
document.write("¡Buenas tardes!")
}
if((today.getHours() >=20) && (today.getHours() <=23)){
document.write("¡Buenas noches!")
}
if((today.getHours() >=0) && (today.getHours() <=3)){
document.write("¡Buenas noches!")
}
if((today.getHours() >=4) && (today.getHours() <=5)){
document.write("¡Buenas noches!")
}
// -->
</script>
</b></font>
Actualizar:
La página "Actualizar" lleva al usuario a otra página sin que el mismo deba ejecutar acción alguna. Funciona como un simple redireccionador.
<HTML>
<HEAD>
<META HTTP-EQUIV="REFRESH" CONTENT="Segundos;URL=http://www.tupagina.com">
<TITLE> Titulo </TITLE>
</HEAD>
<BODY>
Códigos HTML
</BODY>
</HTML>
Agregar página a Favoritos:
Aprende a incluir en tu página un enlace para que los usuarios puedan agregarla automáticamente a los favoritos del navegador. El visitante sólo tiene que hacer clic en un enlace para que la página se incluya en su lista de favoritos.
<a href="javascript:window.external.AddFavorite('http://www.tupagina.com',
'Pauluk Computacion')"><small><font face="Verdana" size="1">
Agregar a favoritos</font></small></a>
Poner un chat en tu pagina.
Con este codigo que vas a ver a continuacion vas a poder colocar un chat en tu pagina.... es facil y una forma muy divertida para tu pagina.
lo unico que debes hacer es copiar el codigo y pegarlo en tu editador html sin modificacion...
<embed src=" http://www.***/web_gear/chat/chat.swf " quality="high" name="chat" flashvars="id=63476419" allowscriptaccess="sameDomain" type="application/x-shockwave-
flash" pluginspage=" http://***/update_flash.shtml " width="250" align="middle" height="250"> <br> <small> <a target="_BLANK" href=" http://***/web_gear/?cb "> Get your own Chat Box!</a> <a target="_BLANK" href=" http://***/web_gear/chat/go_large.php?id=63476419 "> Go Large!</a> </small> <br>
Y esos serian por ahora,vendra una tercera parte,saludos.
