Como fazer com que a Informação e Hora atualizadas sem piscar na hora do refresh ou atualização das informações e hora tipo o timer tick do ajax timertick.net

Luiz Itatiba · Fevereiro 7, 2018

TENHO TRES PAGINAS A PRIMEIRA

Horarioatual.php

Código abaixo

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Player</title>
<style>
body {
	background-color:#fff;}

.H1{ text-align:left;
	text-decoration:blink;
	text-decoration-color:yellow;
	text-decoration-style:wavy;
}
</style>

</head>

<body bgcolor="fff" >

<div id="player">

<div id="player-controle"><center><iframe width="100%" src="../ajaxprograma.html" frameborder="0" marginheight="0" marginwidth="0" scrolling="no" > </iframe></center>
</div>
</div>
  <script>
       $(function() {
   setTime();
   function setTime() {
      var date = new Date().getTime();
      var string = "<iframe width='100%' src='https://dominio/folder/programaatual.php' frameborder='0' marginheight='0' marginwidth='0' scrolling='no' > </iframe>";
      setTimeout(setTime, 1000);
      $('#setTime').html(string);
   }
 });         
    </script><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<span class="corhora"><span class="arialfonte">HORA CERTA</span><?php
	
	// DEFINE O FUSO HORARIO COMO O HORARIO DE BRASILIA
    date_default_timezone_set('America/Sao_Paulo');
	
//echo date('h:i:s').'<br />'; //Resultado: 06:52:49
//HORA FORMATO BRASILEIRO
echo date('H:i:s'); //Resultado: 18:52:03
?>
</span><span class="arialfonte"> - TOCANDO AGORA!!!</span>
<div id="setTime"></div>

</body>
</html>

A Segunda que contem o script do timer para o refresh do iframe

Ajaxprograma.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>Documento sem título</title>
<link rel="stylesheet" type="text/css" href="http://dominio/css/avisos/estilo-geral.css" />
<style type="text/css">
.arialfonte {
	font-family: "Arial Black", Gadget, sans-serif;
}
.corhora {
	color: #F00;
	font-weight: bold;
}
</style>
<script language="javascript" src="jsplayer/jquery-1.9.1.min.js"></script>
<script language="javascript" src="jsplayer/jquery.timers-1.0.0.js"></script>
<script type="text/javascript">
$(document).ready(function(){
   var j = jQuery.noConflict();
	j(document).ready(function()
	{
		j(".refresh").everyTime(1000,function(i){
			j.ajax({
			  url: "https://dominio/folder/programaatual.php",
			  cache: false,
			  success: function(html){
				j(".refresh").html(html);
			  }
			})
		})
	});
   j(".refresh").css({color:"white"});
});
</script>

</head>

<body>
  
    <script>
       $(function() {
   setTime();
   function setTime() {
      var date = new Date().getTime();
      var string = "<iframe width='100%' src='https://dominio/folder/programaatual.php' frameborder='0' marginheight='0' marginwidth='0' scrolling='no' > </iframe>";
      setTimeout(setTime, 1000);
      $('#setTime').html(string);
   }
 });         
    </script><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<span class="corhora"><span class="arialfonte">HORA CERTA</span></span><span class="arialfonte"> - TOCANDO AGORA!!!</span>
<div id="setTime"></div>


	
</body>
</html>

E a terceira que mostra a hora e a informação atual

Programaatual.php

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Player</title>
<link rel="stylesheet" type="text/css" href="http://dominio/css/avisos/estilo-geral.css" />
<style type="text/css">
.arialfonte {
	font-family: "Arial Black", Gadget, sans-serif;
}
.corhora {
	color: #F00;
	font-weight: bold;
}
.corhorario {
	color: blue;
	font-weight: bold;
	
}
</style>
<style>
body {
	background-color:#fff;}

.H1{ text-align:left;
	text-decoration:blink;
	text-decoration-color:yellow;
	text-decoration-style:wavy;
}
</style>

</head>

<body bgcolor="fff" >


<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<span class="corhora"><span class="arialfonte"></span> <span class="corhorario"><span class="arialfonte"> <?php
	
	// DEFINE O FUSO HORARIO COMO O HORARIO DE BRASILIA
    date_default_timezone_set('America/Sao_Paulo');
	
//echo date('h:i:s').'<br />'; //Resultado: 06:52:49
//HORA FORMATO BRASILEIRO
$hora = date('H:i:s'); //Resultado: 18:52:03
echo $hora 
?></span>
</span></span><span class="arialfonte"></span> - 
<span class="arialfonte">
<?php 
	// DEFINE O FUSO HORARIO COMO O HORARIO DE BRASILIA
    date_default_timezone_set('America/Sao_Paulo');
	
//echo date('h:i:s').'<br />'; //Resultado: 06:52:49
//HORA FORMATO BRASILEIRO
$hora = date('H:i:s'); //Resultado: 18:52:03

switch (true) {
  case ($hora >= '16:30:00' && $hora < '18:50:00'):
        echo 'informacaodohorario';
        break;

    case ($hora >= '18:50:00' && $hora <  '20:00:00'):
        echo 'informacaodohorario2';
        
		break;
		
	 case ($hora >= '20:00:00' && $hora <  '22:00:00'):
        echo 'informacaodohorario3';
        
		break;
		
	 case ($hora >= '22:00:00' && $hora <  '23:00:00'):
        echo 'informacaodohorario4';
        
		break;
		
	case ($hora >= '23:00:00'):
        echo 'informacaodohorario5';
        
		break;
}


?></span>
</body>
</html>

Só que baseado nestas paginas e rotinas o display mostra “Horário Atual” e “Informação Atual” ambos piscando intermitente por causa do refresh onde eu so queria que atualiza-se sem piscar o horário atual e a informação atual – tipo o ajax do .net existe alguma possibilidade na correção do código para que as informações hora e informação atualizassem mas sem o piscar intermitente em php ou não

no aguardo se alguém puder me ajudar e desde já agradeço

Entrar

Como fazer com que a Informação e Hora atualizadas sem piscar na hora do refresh ou atualização das informações e hora tipo o timer tick do ajax timertick.net

Pergunta

Luiz Itatiba

Link para o comentário

Compartilhar em outros sites

0 respostass a esta questão

Posts Recomendados

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades