Ir para conteúdo

POWERED BY:

Arquivado

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

LeWebApprentice

[Resolvido] (CALENDARIO JQUERY) Problemas com exibição

Recommended Posts

Olá,

Sou novo no fórum e estou tendo um problema qu está me dando dor de cabeça já.

Adicionei um calendario jquery(jquery.click-calendario-1.0) no meu projeto e ele funciona, porém após algumas mudanças a página onde eu chamava o calendario acabou virando uma pagina que eu incluo em uma div content, ele continua abrindo o calendário, porém está completamente "zuado"(screen).

Segue os arquivos principais:

Index.php

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='js/jquery-1.7.1.js'></script>
<script type="text/javascript" src="js/jquery.simplemodal-1.4.2.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.js"></script> 
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>
<script type="text/javascript" src="js/jquery.click-calendario-1.0.js"></script>
<link rel="stylesheet" type="text/css" href="css/tables.css"/>
<link rel="stylesheet" type="text/css" href="css/modal.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.click-calendario-1.0.css"/>
<link rel="stylesheet" type="text/css" href="css/Idefault.css"/>
<link rel="stylesheet" type="text/css" href="css/default.css" />
<link rel="stylesheet" type="text/css" href="css/frame.css" />
<!--[if IE]>
<style>
#output {height: 89%; width: 45%; float: left;display:inline;line-height: 0.97cm}
#output p {font-size:22;margin-left: 75%}
#menu.FORM {margin-top: 0.25cm; height: 89%; width: 50%; float: left;display:inline;line-height: 0.4cm}
</style>
<![endif]-->
<script type="text/javascript">
$(function(){
   $("#carregando").hide();
   $("ul#menu a").click(function(){
       pagina = $(this).attr('href');
       $("#carregando").ajaxStart(function(){
		$(this).show();
       });
       $("#carregando").ajaxStop(function(){
           $(this).hide();
       });
	$("#content").load(pagina);
       return false;
   });
});
$(function(){
   $("#carregando").hide();
   $("#cep").bind('submit',function() {
       pagina = $("#form1").attr('action');
       $("#carregando").ajaxStart(function(){
		$(this).show();
       });
       $("#carregando").ajaxStop(function(){
           $(this).hide();
       });
	$("#frame").load(pagina);
       return false;
   });
});


</script>
</head>
<body>
<div class="master">

<!-- HEADER -->
<div class="header">
<center><b><u>Sistema de administração para envio de correnspondência FTG</u></b></center>
</div>

<!-- MENU -->
<div class="menu">
	<p class="M">
		<ul id="menu">
			<li><a href="home.php">Página Inicial</a></li>
			<br />
			<li><a href="FTG%20FORM.php">Formulário</a></li>
			<br />
			<li><a href="select.php">Consulta</a></li>
			<br />
			<li><a href="update.php">Alterar</a></li>
			<br />
			<li><a href="relatorio.php">Relatório</a></li>
			<br />
			<li><a href="adm.php">Administrador</a></li>
		</ul>
	</p>
</div>

<!-- MAIN -->
<div class="content" id="content">
<img src="img/ajax-loader.gif" id="carregando">
<?php include("home.php"); ?>
</div>
<!-- FOOTER -->
<div class="footer">
</div>
<div id="dialog" >
	<select id="SEARCH">
			<option value=""  />Busca por</option>
			<option value="NAME"  />Parte do Nome</option>
			<option value="CNPJ"  />CNPJ</option>
			<option value="COD"  />Código do Cliente</option>
			</select>
	<input type="text" id="ok"><br>
	<input type="button" onclick="showHint()" value="Enviar" class="send"></button>
</div>
</div>
</body>
<script type="text/javascript">
$(document).ready(function() 
   { 
       if(document.getElementById("results")!=null){
	$("#results")
	.tablesorter({debug: false,widthFixed: true, widgets: ['zebra'], dateFormat: "uk"})
	.tablesorterPager({container: $("#pager")});	
   } 
}); 
</script>
</html>

 

functions.js

function _date(){
var hoje = new Date();
var diaAtual = hoje.getDate();
var mesAtual = hoje.getMonth()+1;
var anoAtual = hoje.getFullYear();
var dataAtual = diaAtual+'/'+mesAtual+'/'+anoAtual;
$('.data_1').focus(function(){
	$(this).calendario({ 
		target: this,
		minDate: dataAtual
	});
});
}

 

FTG FORM.php

<input type="text" name="DATE" class="data_1" onclick="_date()" maxlength="10" style='background-color:#EBEBE4' readonly="readonly"/>

jquery.click-calendario-1.0.css

div.calendario {
width: 154px;
position: absolute;
background: #fff url('/img/fe/bg_calendario_sombra.gif') repeat-y right;
border-left: 1px solid #f6f6f6;
border-top: 1px solid #f6f6f6;	
display: none;
}

div.calendario a.fechar {
display: block;
position: absolute;
top: -19px;
right: 0px;
height: 18px;
text-decoration: none;
background: #fff;
width: 20px;
text-align:center;
vertical-align: center;
line-height: 18px;
color: #000;
font:bold 12px Tahoma;
}

div.calendario a.bt_controle_mes {
display: block;
height: 15px;
position: absolute;
top: 0px;
vertical-align: middle;
text-decoration: none;
color:#222;
line-height:15px;
vertical-align: middle;	
}

div.calendario a.bt_voltar_mes { left: 2px; }
div.calendario a.bt_avancar_mes { right: 2px; }

div.calendario p.nome_mes {
text-align: center;
display: block;
height: 18px;
background: #efeff0;
font-size: 12px;
font-weight: bold;
color: #6d6d6d;
line-height:18px;
vertical-align: middle;
margin: 0;
}

div.calendario ul {
margin:0;
padding:0;
}
div.calendario ul li {
display: block;
float: left;
width: 22px;
height: 17px;
text-align: center;
font-size: 11px;
line-height: 17px;
vertical-align: middle;
}

div.calendario ul li a { font-weight: bold; color:#6d6d6d; text-decoration:none; }
div.calendario ul li a:hover { text-decoration: underline; }

div.calendario ul li.semana {
background: #c0c7ca;
font-weight: bold;		
color: #fff;
}

div.calendario ul li.dia {
color: #999;
}

div.calendario ul li.default {	
background: #ececed;
color: #f00; 
font-weight: bold;
}

div.calendario ul li.default a { color: #f00; }

div.exemplo { margin-bottom: 150px;

 

Agradeço desde já.

Compartilhar este post


Link para o post
Compartilhar em outros sites

O seu problema, é a situação que explico aqui:

 

http://wbruno.com.br/2011/08/22/usando-lightbox-em-pagina-carregada-ajax/

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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