Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Pedro Libório

[Resolvido] Calendario com Javascript

Por , em Javascript

Recommended Posts

Pedro Libório    0

Pedro Libório
Postado

Olá pessoal eu to começando com javascript desenvolvi um codigo pra um calendario. Mas estou com problemas ele tah gerando 72 meses eu queria apenas o ano atual ou seja deveriam aparecer na pagina apenas 12 meses. Eu coloquei os html o css e js pra ajudar aentender o codigo js.

Segue o codigo:

 

*JAVASCRIPT:

// JavaScript Document

function Calendario(){
var calendario = "";
var data = new Date();
var ano = data.getFullYear(); 
var dia = data.getDate();
var fev = 28;
var i;

if(Bissexto(ano))// altera o ano se for bissexto
	fev=29; 

for(i=1;i<13;i++){

	switch(i){

		case 1:
			calendario+= Mes(31,"janeiro");


		case 2:
			calendario+= Mes(fev,"fevereiro");

		case 3:
			calendario+=Mes(31,"marco");

		case 4:
			calendario+=Mes(30,"abril");

		case 5:
			calendario+=Mes(31,"maio");

		case 6:
			calendario+=Mes(30,"junho");

		case 7:
			calendario+=Mes(31,"julho");

		case 8:
			calendario+=Mes(31,"agosto");

		case 9:
			calendario+=Mes(30, "setembro");

		case 10:
			calendario+=Mes(31, "outubro");

		case 11:
			calendario+=Mes(30, "novembro");

		case 12:
			calendario+=Mes(31, "dezembro");

		}

}

//insere o calendario formatado na div
document.getElementById("calendario").innerHTML = calendario;
}


function Bissexto(ano){//verifica se um ano é bissexto retiran verdadeiro se é bissexto
if( (ano % 400 == 0) || ((ano % 4 == 0) && (ano % 100 != 0)) )
	//se o ano for multiplo de 4 e nao multiplo de 100
		return true;

else
	return false;		 

}

function Mes(dias,mes){//monta uma <ul> onde cada dia é uma <li>
var string="<ul id ='"+ mes +"' class='mes' >";

for(i=1;i<=dias;i++)
	string+="<li id='dia" + i +"' class='dia'>" + i + "</li>";

	string+="</ul>";
return string;	


}

 

*HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sou Jovem Wesleyano - Eventos</title>
<script type="text/javascript" language="javascript1.5" src="calendario.js"></script>

</head>

<body onload="Calendario();">
<div id="calendario">

   </div>
</body>
<link rel="stylesheet" type="text/css" href="evento.css" />
</html>

 

*CSS

@charset "utf-8";
/* CSS Document */

.mes{
display:inline-block;
list-style-type:none;
height:100px;
width:200px;
height:100px;
border:solid #000;

padding-left:3px;
margin-left:5px;

}
.dia{
display:inline-block;
width:10px;
margin: 1px, 1px, 1px, 1px;


}
#calendario{
margin: 10px auto;	
width: 650px;
border:solid #000;
height:auto 

}

 

Grato pela atenção.

Liborio.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme_90    33

Guilherme_90
Postado

Cara, pega o calendário pronto no site do jQuery, vai na aba UI e seja feliz. Não reenvente a roda!

Compartilhar este post

Link para o post
Compartilhar em outros sites

JCMais    75

JCMais
Postado

Cara, pega o calendário pronto no site do jQuery, vai na aba UI e seja feliz. Não reenvente a roda!

 

Reiventar é uma coisa, tentar fazer para ganhar experiência e aprender a fazer é outra. ;)

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito