HTML

Calendario mensual

<SCRIPT LANGUAGE="JavaScript"> <!-- Mas scripts en http://www.creatupropiaweb.com --> <!-- Begin var now = new Date(); var month_array = new Array("january","february","march","April","May","June","July","August","September","October","November","December"); document.write("<form name=date_list><table bgcolor=silver><tr><td>"); document.write("<select name=month onchange=change_month(this.options.selectedIndex)>"); for(i=0;i<month_array.length;i++) { if (now.getMonth() != i) {document.write ("<option value="+i+">"+month_array[i]);} else {document.write ("<option value="+i+" selected>"+month_array[i]);} } document.write("</select>"); document.write("</td><td>"); document.write ("<select name=year onchange=change_year(this.options[this.options.selectedIndex])>"); for(i=1950;i<3000;i++) { if (now.getYear() != i) {document.write("<option value="+i+">"+i);} else {document.write("<option value="+i+" selected>"+i);} } document.write("</select></td></tr><tr><td colspan=2><center>"); document.write("<table bgcolor=white border=0 cellspacing = 0 cellpading = 0 width=100%><tr bgcolor=gray align=center>"); document.write("<td><font color=silver>M</font></td><td><font color=silver>T</td><td><font color=silver>W</td><td><font color=silver>T</td><td><font color=silver>F</td><td ><font color=silver>S</td><td ><font color=silver>S</td>"); document.write("</tr><tr>"); for(j=0;j<6;j++) { for(i=0;i<7;i++) { document.write("<td align=center id=d"+i+"r"+j+"></td>") } document.write("</tr>"); } document.write("</table>"); document.write("</center></from></td></tr></table>"); var show_date = new Date(); function set_cal(show_date) { begin_day = new Date (show_date.getYear(),show_date.getMonth(),1); begin_day_date = begin_day.getDay(); end_day = new Date (show_date.getYear(),show_date.getMonth()+1,1); count_day = (end_day - begin_day)/1000/60/60/24; input_table(begin_day_date,count_day); } set_cal(show_date); function input_table(begin,count) { init(); j=0; if (begin!=0){i=begin-1;}else{i=6} for (c=1;c<count+1;c++) { colum_name = eval("d"+i+"r"+j); if ((now.getDate() == c)&&(show_date.getMonth() == now.getMonth())&&(show_date.getYear() == now.getYear())) {colum_name.style.backgroundColor = "blue";colum_name.style.color = "white";}; colum_name.innerText = c; i++; if (i==7){i=0;j++;} } } function init() { for(j=0;j<6;j++) { for(i=0;i<7;i++) { colum_name = eval("d"+i+"r"+j); colum_name.innerText = "-"; colum_name.style.backgroundColor =""; colum_name.style.color =""; } } } function change_month(sel_month) { show_date = new Date(show_date.getYear(),sel_month,1); set_cal(show_date); } function change_year(sel_year) { sel_year = sel_year.value; show_date = new Date(sel_year,show_date.getMonth(),1); set_cal(show_date); } // End --> </script>

Copia y pega en cualquier parte de tu pagina

Calendario diario

<!-- Mas scripts en http://www.creatupropiaweb.com --> <script languaje="JavaScript"> mesarray=new Array("Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio","Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"); diaarray=new Array( "Domingo","Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado"); hoy = new Date(); dias = hoy.getDate(); dia = hoy.getDay(); mes = hoy.getMonth(); mes=mesarray[mes]; dia =diaarray[dia]; anno = hoy.getYear(); if (anno <200) anno = anno+1900; document.write('<TABLE WIDTH="60" height="60" BORDER="2" BGCOLOR="#FFFFFF"><TR><TD><CENTER>'); document.write('<FONT SIZE="2" COLOR="#000000"> <B>'+mes+'</B></FONT><br>'); document.write('<FONT SIZE="1" COLOR="#000000">'+anno+'</FONT><br>'); document.write('<FONT SIZE="4" COLOR="#000000" FACE="Arial"><B>'+dias+'</B></FONT><br>'); document.write('<FONT SIZE="1" COLOR="#000000">'+dia+'</FONT><br>'); document.write('</CENTER></TR></TD></TABLE>'); </script>
Copia y pega en cualquier parte de tu pagina .

Cajita informacion de enlaces

<DIV ID="idCajita" STYLE="position:absolute; visibility:hide;"></DIV> <script language="javascript1.2"> <!-- Mas scripts en http://www.creatupropiaweb.com --> <!-- var anchoCaja = "140"; var anchoBorde = "1"; // Espacio entre celdas: var espCel= 0; //Espacio a los bordes: var espBor= 3; // Desplazamiento eje X resp. posicion del raton var despX = 10; // Desplazamiento eje Y resp. posicion del raton var despY = 8; // Tipo y tamanio letra: titulo var ffaceTitulo= "Verdana"; var ftamaTitulo= 3; // Tipo y tamanio letra: texto var ffaceTexto= "verdana"; var ftamaTexto= 2; // Colores: var colFondo = "lightcyan"; var colBorde = "brick"; var colTexto = "black"; var colTitulo = "white"; var colFondoTitulo = "red"; NN4 = (document.layers)? true:false IE4 = (document.all)? true:false // Variables GLOBALES: var x = 0; var y = 0; var esVisible = 0; var alineamiento; // 0: izquierda, 1: centrado; 2: derecha if (NN4) { cajita = document.idCajita; mostrarSi= 'show'; mostrarNo= 'hide'; } if (IE4) { cajita = idCajita.style; mostrarSi= 'visible'; mostrarNo= 'hidden'; } document.onmousemove= MovimientoRaton; if (NN4) { document.captureEvents(Event.MOUSEMOVE); } // Funciones a usar con onMouseOver: function PopDcha (texto, titulo) { PopCajita (2,texto,titulo); } function PopIzda (texto, titulo) { PopCajita (0,texto,titulo); } function PopCentrado (texto, titulo) { PopCajita (1,texto,titulo); } // Funcion a usar con onMouseOut: function CierraPop () { esVisible= 0; Ocultar (cajita); } function Mostrar (objeto) { objeto.visibility= mostrarSi; } function Ocultar (objeto) { objeto.visibility= mostrarNo; } function moverAbs (objeto, a, b) { objeto.left = a; objeto.top = b; } function PopCajita (alin, texto, titulo) { txt = "<table width=" + anchoCaja + " borderColor=" + colBorde; txt += " border=" + anchoBorde + " cellspacing=" + espCel; txt += " cellpadding=" + espBor; if (titulo != "") { txt += " bgcolor=" + colFondoTitulo+" >"; txt += "<tr><td><b><font size=" + ftamaTitulo + " face=" + ffaceTitulo; txt += " color=" + colTitulo + ">" + titulo + "</font></b>"; } else { txt += ">"; } txt += "<tr><td bgcolor=" + colFondo + "><font size=" + ftamaTexto; txt += " face=" + ffaceTexto + " color=" + colTexto + ">" + texto; txt += "</font></table>"; GenerarCapa(txt); alineamiento = alin; AbrirCajita(); } function AbrirCajita () { if (esVisible == 0) { if (alineamiento == 1) { // Center moverAbs(cajita,x+despX-(anchoCaja/2),y+despY); } if (alineamiento == 2) { // Right moverAbs(cajita,x+despX,y+despY); } if (alineamiento == 0) { // Left moverAbs(cajita,x-despX-anchoCaja,y+despY); } Mostrar(cajita); esVisible = 1; } } function MovimientoRaton (evento) { if (NN4) { x= evento.pageX; y= evento.pageY; } if (IE4) { x= event.x; y= event.y; } if (esVisible) { if (alineamiento == 1) { // Center moverAbs(cajita,x+despX-(anchoCaja/2),y+despY); } if (alineamiento == 2) { // Right moverAbs(cajita,x+despX,y+despY); } if (alineamiento == 0) { // Left moverAbs(cajita,x-despX-anchoCaja,y+despY); } } } function GenerarCapa (txt) { if (NN4) { var capa= document.idCajita.document; capa.write (txt); capa.close(); } if (IE4) { document.all["idCajita"].innerHTML= txt; } } // --> </script>

<a href="enlace.html" onMouseOver="PopCentrado ('Aqui pones la descripción del enlace','AQUI EL TITULO');return true"; onMouseOut="CierraPop();return true;">ENLACE</a>
Este es el codigo que tendras que utilizar en tus enlaces

Abre una ventana con el contenido que tu quieras en tu pagina

<!-- Mas scripts en http://www.creatupropiaweb.com --> <script language=JavaScript> var browser = navigator.appName; var version = navigator.appVersion; if (browser=="Microsoft Internet Explorer" && version>="4") { document.write('<iframe name="window" src="AQUI LA URL QUE QUIERAS ABRIR" width="400" height="146" marginwidth="0" scrolling="yes" frameborder="0"></iframe>'); } </script>
Copia y pega en donde quieras el efecto en tu pagina .