Cómo puedo insertar un calendario y notificaciones ??

Txerrinko · #1 (**permalink**) 31/10/2011, 10:05

como puedo insertar un calendario y las notificaciones en una pagina web???

que haya un simple calendario con notificaciones acerca de la actividad que puede haber un dia y que el usuario pueda tener la opcion de agregar eventos un dia por ejemplo?? alguna sugerencia teneis ??

maycolalvarez · #2 (**permalink**) 31/10/2011, 13:32

con un script del lado del server

anagbohorquez · #3 (**permalink**) 01/11/2011, 09:36

Hola! En que formato esta tu página web???

diegoalvarezb · #4 (**permalink**) 01/11/2011, 10:47

Hola, aquí te dejo un script que te puede servir:

Configuración

idContenedor = "miCalendario" //Identificador del contenedor donde se quiera insertar el calendario

El resto de aspectos se configuran desde la hoja de estilos

#mesCalendario para configurar aspectos de la caja que muestra el mes y el año
.Hoy para configurar aspectos de la caja que muestra el día actual

Finalmente hay que iniciar el calendario, podemos usar el evento onload del tag body

<body onload="tunCalendario();" >

<script type="text/javascript">
/************************************************** ***************************
Calendario. Script creado por DiegoWebStudio
www.diego.com.ec
************************************************** ****************************/
var idContenedor = "miCalendario"

var hoy = new Date()
var mes = hoy.getMonth()
var dia = 1
var anio = hoy.getFullYear()
var diasSemana = new Array ('L','M','M','J','V','S','D')
var meses = new Array('Enero','Febrero','Marzo','Abril','Mayo','Ju nio','Julio','Agosto','Septiembre','Octubre','Novi embre','Diciembre')
var tunIex=navigator.appName=="Microsoft Internet Explorer"?true:false;
if(tunIex && navigator.userAgent.indexOf('Opera')>=0){tunIex = false}
tunOp = navigator.userAgent.indexOf('Opera')>=0 ? true: false;
function tunCalendario(){
dia2 = dia
tab = document.createElement('table')
tab.id = 'calendario'
document.getElementById(idContenedor).appendChild( tab)
tcabeza = document.createElement('thead')
tab.appendChild(tcabeza)
fi2 = document.createElement('tr')
fi2b = document.createElement('th')
fi2b.colSpan = 7
fi2.id = 'mesCalendario'
fi2b.appendChild(document.createTextNode(meses[mes] + " - " + anio))
fi2.appendChild(fi2b)
tcabeza.appendChild(fi2)
fi = document.createElement('tr')
tcabeza.appendChild(fi)
for(m=0;m<7;m++){
ce = document.createElement('th')
ce.appendChild(document.createTextNode(diasSemana[m]))
fi.appendChild(ce)
}
var escribe = false
var escribe2 = true
fecha = new Date(anio,mes,dia)
var d = fecha.getDay()-1 //dia semana
if(d<0){d = 6}
tcuerpo = document.createElement('tbody')
tab.appendChild(tcuerpo)
while(escribe2){
fi = document.createElement('tr')
co = 0
for(t=0;t<7;t++){
ce = document.createElement('td')
if(escribe && escribe2){
fecha2 = new Date(anio,mes,dia)

if(fecha2.getMonth() != mes){escribe2 = false;}
else{ce.appendChild(document.createTextNode(dia)); dia++;co++}
}
if(d == t && !escribe){
ce.appendChild(document.createTextNode(dia))
dia++;co++
escribe = true
}
fi.appendChild(ce)
if(hoy.getDate()+1 == dia && mes == hoy.getMonth() && anio == hoy.getFullYear()){ce.className = "Hoy"}
}

if(co>0){tcuerpo.appendChild(fi)}

}
dia = dia2
}

</script>

<style type="text/css">
#calendario{
font-family: Tahoma, Arial, Helvetica, sans-serif;
font-size: 10px;
text-align: center;
margin-left: auto;
margin-right: auto;
border-collapse: collapse;
border-right: 2px solid #999999;
border-bottom: 2px solid #999999;
}

/*#mesCalendario para configurar aspectos de la caja que muestra el mes y el año*/
#mesCalendario{
font-weight: bold;
text-align: center;
color: #CC6633;
background-color: #E4CAAF;

}
#calendario th, #calendario td{
border: 1px solid #999999;
padding: 3px;
font-size: 110%;
}
#calendario th{
color: #CC6633;
}

/*.Hoy para configurar aspectos de la caja que muestra el día actual*/
.Hoy{
color: #ffffff;
background-color: #666666;
font-weight: normal;
}
#miCalendario{
text-align: center;
}
</style>