Hola, tengo un problemilla con mi calendario en javascript y no se cual es exactamente.. :S
El calendario del que hablo le podeis ver aquí
http://tunait.com/javascript/index.php?s=calendarioefemerides#codigo
Mi problema es que una vez implementado en mi web, seleciono otro mes y el calendario no se actualiza, es decir, no cambia de mes.. sin embargo ahí sí.
** El fichero más importante esta en el siguiente mensaje, no cabía todo.
Los ficheros los he copiado tal cual los bajé.
calendarioefemerides_config.js
Código:
/** Configuración general **/
var idContenedor = "miCalendario" //id del contenedor donde se insertará el calendario
var calendarioCursor = 'pointer'
var calendarioPaddingCelda = 3; //Corrige la posición del cuadro que marca el día seleccionado en caso de haberse aplicado un padding a las celdas
var tagTitulos = 'h2' //Tag a usar en los títulos de eventos y efemérides
var textoVerTodos = 'Listar todo el mes'
/** fin configuración general **/
function evento(fecha, titulo, texto, enlace){
this.fecha = fecha;
this.titulo = titulo;
this.texto = texto;
this.enlace = false;
if(enlace) this.enlace = enlace
}
/** agregamos los listados de efemérides y eventos por meses:
var nombreDelMes = new Array();
nombreDelMes.push(new evento('fecha en formato aaaammdd o mmdd', 'Título', 'Texto','Link [opcional]'));
**/
var enero = new Array();
enero .push(new evento('0101', 'Año Nuevo', '','http://es.wikipedia.org/wiki/1_de_enero'))
var febrero = new Array();
febrero .push(new evento('0214', 'San Valentín', 'Día de los enamorados','http://es.wikipedia.org/wiki/San_Valent%C3%ADn'))
var abril = new Array();
abril.push(new evento('0401', 'Día de los Inocentes', '','http://es.wikipedia.org/wiki/Santos_inocentes'))
abril.push(new evento('20070419', 'Pruebita', 'tararía tarará'))
abril.push(new evento('20070419', 'Comienzo esta cosa ', 'Mira que bien'))
var mayo = new Array();
mayo .push(new evento('0525', 'El día del orgullo Friki', 'en conmemoración al estreno oficial de Star Wars-A New Hope.','http://es.wikipedia.org/wiki/D%C3%ADa_del_orgullo_friki'))
mayo .push(new evento('0525', 'El día de la toalla', '','http://es.wikipedia.org/wiki/D%C3%ADa_de_la_toalla'))
var junio = new Array();
junio .push(new evento('0605', 'Día mundial del medio ambiente', '','http://es.wikipedia.org/wiki/D%C3%ADa_mundial_del_medio_ambiente'))
var agosto = new Array();
agosto.push(new evento('0818', 'Santa Helena', 'Las leporcias también escriben','http://es.wikipedia.org/wiki/Elena_de_Constantinopla'))
var septiembre = new Array();
septiembre.push(new evento('0920', 'Cumple Alena', 'Japi berdei'))
var diciembre = new Array();
diciembre.push(new evento('1228', 'Día de los Santos Inocentes', '','http://es.wikipedia.org/wiki/Santos_inocentes'))
calendarioefemerides.css (No hace falta, pero bueno, para si a alguien le sirve que lo tenga tambien).
Código:
#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 #EEEEEE;
border-bottom: 2px solid #EEEEEE;
}
/*#mesCalendario para configurar aspectos de la caja que muestra el mes y el año*/
#mesCalendario{
text-align: center;
color: #CC6633;
background-color: #EEEEEE;
}
#calendario td{
}
#calendario th, #calendario td{
border: 1px solid #999999;
padding: 3px;
font-size: 150%;
}
#calendario th{
color: #CC6633;
}
/*.diaS para configurar aspectos de la caja que muestra los días de la semana*/
.diaS{
color: #ffffff;
background-color: #666666;
}
/*.celda para configurar aspectos de la caja que muestra los días del mes*/
.celda {
background-color: #FFFFFF;
color: #000000;
font-weight : normal;
cursor: default;
}
/*.Hoy para configurar aspectos de la caja que muestra el día actual*/
.Hoy{
color: #ffffff;
background-color: #666666;
font-weight: normal;
cursor: default;
}
#miCalendario{
text-align: center;
width: 180px;
margin: 0 auto;
}
/*.selectores para configurar aspectos de los campos para el mes y el año*/
.selectores, .cuadroTexto{
font-family: verdana;
font-size: 10px;
color: #990000;
margin: .2em .5em;
border: 1px solid #e1e1e1;
}
.cuadroTexto{ /*Cuadro donde se muestran las efemérides*/
padding: .5em;
}
#miCalendario h2, #miCalendario p{ /*Aspecto de los títulos y párrafos de efemérides*/
margin: .3em 0;
color: #333333;
font-size: 90%;
text-align: left;
}
#miCalendario p{/*Aspecto de los párrafos de efemérides*/
margin-left: 2.5em;
}
.hayEvento{ /*Casilla en el calendario que contiene evento o efeméride*/
background-color: #efefef;
}
.cambiaMes{ /*Controles para pasar los meses (adelante y atrás) */
cursor: pointer;
color: #990000;
font-weight: bold;
font-size: 90%;
}
La implementacion en mi página web
Código:
<script type="text/javascript" src="calendarioefemerides_config.js"></script>
<script type="text/javascript" src="calendarioefemerides.js"></script>
<link href="calendarioefemerides.css" rel="stylesheet" type="text/css" />
<td height="9" bgcolor="#FFFFFF"><div id="miCalendario"></div></td>
Podeis verla en www.juventudmdc.comlu.com
Un saludo y gracias de antemano, a ver si me lo podeis resolver!