top of page

Codigos html para tu web.

Bienvenidos a esta seccion aqui encontraran gran variedad de codigos HTML que sin duda seran de gran ayuda en su web.

 

Imagen con link

Con este codigo podras poner una imagen para que a la hora de darla click los lleve a la direccion que tu quieras.

 

 

  <a href="pon aqui la direccion deseada" target="_self"> <img src="url de tu imagen" border="0" alt="" /> </a>

 

Buscador de google en tu web

Con este codigo podras poner el famoso buscador de google en tu web

 

 

 <center> <FORM method=GET action="http://www.google.com/search"> <TABLE bgcolor="#FFFFFF"><tr><td> <A HREF="http://www.google.com/"> <IMG SRC="http://www.google.com/logos/Logo_40wht.gif" border="0" ALT="Google" align="absmiddle"></A> <INPUT TYPE=text name=q size=31 maxlength=255 value=""> <INPUT TYPE=hidden name=hl value=es> <INPUT type=submit name=btnG VALUE="Búsqueda Google"> </td></tr></TABLE> </FORM> </center>

 

Los visitantes de tu web pueden enviarte un e-mail

Con este codigo cualquier persona puede enviarte un e-mail con Asunto y Mensaje, solo cambia las palabras "pon aqui tu direccion de correo" por tu direccion de correo, al hacer click cobre una palabra se abrira un Outlook para enviar un mensaje con tu dirección, el asunto que quieras y el texto que quieras. Por ejemplo: Haz click aca para mandarme un mensaje.

 

 

<a href="mailto:pon aqui tu direccion de correo?subject=Prueba.&body=Muy buena pagina">Haz click aca para mandarme un mensaje</a> 

 

 

Transforma el cursor en una mira

Este codigo transformara la clasica flechita de Windows en una mira de disparo, copia este codigo y pegalo en texto por encima de la pagina.

 

 

 <style type="text/css"> <!-- body { cursor: crosshair} --> </style>

 

Menu despegable

El menú desplegable permite que coloques varios enlaces en un solo lugar. Con esto, ganás espacio y facilidad de navegación. Este menú no necesita un botón para activarse. Basta con seleccionar el enlace y automáticamente el navegador se dirigirá a la página.

 

 

<form> <select NAME="links" onChange="top.location.href=this.form.links.options[this.form.links.selectedIndex].value"> <option SELECTED>Elija la sección que desee</option> <option VALUE="url de tu seccion">Inicio</option> <option VALUE="url de tu seccion">Juegos</option> <option VALUE="url de tu seccion">Noticias</option> </select> </form>

 

Texto parpadeante

con este codigo el texto que quieras parpadeara en un marco, un exelente codigo.

 

 

 <script language="JAVASCRIPT"> TE1="PON EL TEXTO QUE QUIERAS"; TE2=""; M=TE1; cnt=0; function SH(){ document.Switch.A.value=M; cnt++; if(cnt==1 && M==TE1){M=TE2;} if(cnt==2 && M==TE2){cnt=0;M=TE1;} setTimeout("SH()",500); } // --> </script> <form name="Switch"> <div align="center"><center><p><font color="#008000" face="Verdana"><input name="A" size="50" style="color: #33ff33; font-weight: bold; font-family: Verdana, Arial; background-color: rgb(255,255,255); border: 2px outset rgb(0,128,0); margin-top: auto; padding-left: 5px"> </font><script language="JAVASCRIPT"> <!-- SH(); // --> </script></font></p> </center></div> </form>

 

Recomendar pagina

Con este código podemos hacer que si a un visitante le gustó nuestra Web, la recomiende a un amigo escribiendo su dirección de correo electrónico en la casilla, al hacer click en "Recomendar esta Web" se envía un mensaje de correo con el asunto "checa esta pagina, te puede interesar" y en el cuerpo del mensaje aparece la dirección completa donde se encuentra el código y el título de la misma.

 

 

<form name="eMailer"> ENVÍA ESTA PÁGINA A UN AMIGO <br> Indica su e-mail: <br> <input type="text" name="address" size="25"> <br> <input type="button" value="Recomiendá esta Web!" onClick="mailThisUrl();"> </form> <script language="JavaScript1.2"> var good; function checkEmailAddress(field) { // the following expression must be all on one line... var goodEmail=field.value.match(/b(^(S+@).+((.com)|(.net)| (.edu)|(.mil)|(.gov)|(.org)|(..{2,2}))$)b/gi); if (goodEmail){ good=true } else { alert('Por favor introduce un e-mail valido') field.focus() field.select() good=false } } u=window.location; m="Checa esta pagina, te puede interesar"; function mailThisUrl(){ good=false checkEmailAddress(document.eMailer.address) if (good){ // the following expression must be all on one line... window.location="mailto:"+document.eMailer.address.value+"?subject="+m+"&body="+document.title+" "+u; } } </script>

 

Camara de vigilancia en tu web

Con este codigo podras poner en tu web una camara que te vigila en la parte superior de tu web.

 

<div style="text-align: center;"><a href="http://souldhack.es.tl" style="right: 0px; position: fixed; top: 0px;"><img src="http://1.bp.blogspot.com/-MVAyxEb1Gk0/ThtUzuB5AkI/AAAAAAAADU4/RcEFHCFFvXA/s1600/camaras01pe3.gif" _fcksavedurl="http://img150.imageshack.us/img150/9631/camaras01pe3.gif" alt="" /></a></div>

 

Cambia el fondo de tu web

Con este codigo podras cambiar el fondo de tu web, copia el codigo y pegal oen texto por debajo de la pagina.

 

 

<style> body {  background-image: url(AQUI PON TU URL DE TU IMAGEN); background-repeat: no-repeat; background-attachment: fixed } </style>

 

Este código javascrip muestra la hora y fecha exata en tu página web facilmente:

<color=#000000><script language="JavaScript">  

//http://www.granhermano2011-envivo.blogspot.com/ 

function fecha(){ 

fecha=new Date() 

mes=fecha.getMonth() 

diaMes=fecha.getDate() 

diaSemana=fecha.getDay(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\() 

anio=fecha.getFullYear() 

 

dias=new Array(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\('Domingo','Lunes','Martes','Miercoles','Jueves','Viernes','Sabado') 

meses=new Array(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\('Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre')

document.write('<span id="fecha">') 

document.write (dias[diaSemana] + ", " + diaMes + " de " + meses[mes] + " de " + anio)

document.write ('</span>') 

</script> 

<style type="text/css">  

<!-- 

#fecha { 

    font-family: Tahoma, Verdana, Arial; 

    font-size: 12px; 

    color: #000000; 

        background :  

--> 

</style>  

<script language="JavaScript">  

function hora(){ 

var fecha=new Date() 

var hora=fecha.getHours() 

var minuto=fecha.getMinutes() 

var segundo=fecha.getSeconds() 

if (hora < 10) {hora="0" + hora} 

if (minuto < 10) {minuto="0" + minuto} 

if (segundo < 10) {segundo="0" + segundo} 

var horita=hora + ":" + minuto + ":" + segundo 

document.getElementById(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\('hora').firstChild.nodeValue=horita 

tiempo=setTimeout('hora()',1000) 

function inicio(){ 

document.write('<span id="hora">') 

document.write ('000000</span>') 

hora() 

</script> 

<style type="text/css">  

<!-- 

#hora { 

    width:100px; 

    font-family: Tahoma, Verdana, Arial; 

    font-size: 12px; 

    color: #000000; 

    background :  

    } 

--> 

</style>    

<div align="center">  

<b><script>fecha()</script></b></div> 

<div align="center"> 

<b><script>inicio()</script></b></div></color>



Leer más: http://www.todopatuweb.net/codigos/

 

 

TEXTO EN MOVIMIENTO

 

 

<marquee id="ejemplo" direction="right">Texto que saldra</marquee> 

 

 

 

Saludo al visitante

 


<font size="2" face="arial"><b><script language="JavaScript" type="text/javascript">
//<![CDATA[
<!--
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>

Esto le aparecera segun el horario si es de dia buenos dias y asi sucesivamente.

ejemplo: arriba del buscador de mi web

 

 

TEXTO EN MOVIMIENTO DE ARRIBA ABAJO O VICEVERSA

 

<marquee id="ejemplo" direction="up">
  AQUI VA EL TEXTO QUE DESEES </marquee><a href="javascript:void(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(0);" onclick="getElementById(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\('ejemplo').direction='down';">
  Hacia abajo
</a>---
<a href="javascript:void(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(0);" onclick="getElementById(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\('ejemplo').direction='up';">
  Hacia arriba
</a>

 

 

Boton Personalizado con enlaces

 

<font face="Arial, Helvetica, sans-serif" size="2"><script language="JavaScript" type="text/javascript">
//<![CDATA[

var timerID=null
var timerRunning=false
var charNo=0
var charMax=0
var lineNo=0
var lineMax=4
var lineArr=new Array(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(lineMax)
var urlArr=new Array(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(\(lineMax)

lineArr[1]="Codigos Hmtl"
urlArr[1]="http://jrztd.jimdo.com/seccion-html/"
lineArr[2]="descargas"
urlArr[2]="http://jrztd.jimdo.com/descargas"
lineArr[3]="google"
urlArr[3]="http://google.com.co"
lineArr[4]="no le des clic"
urlArr[4]="http://images4.fanpop.com/image/photos/17600000/Justin-Bieber-justin-bieber-17673608-500-543.jpg"

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>

 

Con este codigo podras crear un boton y dentro de el habran varios enlaces, es decir el boton cambiara de links a diferentes webs que tu coloques. Puedes colocar tantos Tantos links como desees.

 

 

 

codigo para ventana de texto

 

<div align="center">    <div id="preview" style=    "BORDER-RIGHT: #000 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #000 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; WORD-SPACING: 1px; OVERFLOW: scroll; BORDER-LEFT: #000 1px solid; WIDTH: 180px; PADDING-TOP: 1px; BORDER-BOTTOM: #000 2px solid; HEIGHT: 150px; TEXT-ALIGN: left">    <p>            AQUI VA LO Q TU QUIERAS CAMBIA ESTE TEXTO.        </p>    </div></div>

 

 

 

Codigo html para poner botón "ir arriba" 

 

 Este codigo html es para jimdo o su web y es para poner un boton para que al darle clic sus usuarios vallan directo arriba

 

</script></div><div class="n"><div class="n">
    <a href="#" title="Ir arriba"><img alt="Ir arriba" border="0" src="Aquí va la url de tu imagen" style="position:fixed; bottom:0; right:0;"/></a>
</div>

 

por defecto esta en la parte bottom:0; right (abajo,derecha)

 

 

 

ARAÑA EN TU WEB

<img border='0' src='http://u.jimdo.com/www21/o/s4e9df44a0ad8ccd8/img/i6a75ddb4c2178b38/1413468702/std/image.gif' style='position:fixed; top:0; left:0;'/>

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Siguemos

  • w-facebook
  • Twitter Clean
bottom of page