Jump to content
PeeWee

Dar Refresh Só Na Div A Cada X Segundos

Recommended Posts

Boa noite pessoal, preciso fazer com que seja carregado somente a informação dentro de uma determinada div, pois ela deve atualizar quando for alterada a informação no BD. Carregar a pagina inteira a cada 5 segundos seria ruim pois provavelmente o usuário estranharia, fiz da seguinte forma, conforme os prints.

 

Deu certo, porém a informação foi alterada a  partir da alteração feita no banco de dados, porém, dentro da div, apareceu outra página igual, gerando duplicidade sobreposta.

Aguardo sugestões.

Screenshot_21.jpg

Screenshot_22.jpg

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Mewmew
      Bom dia!
       Teria como alguém me ajudar? 
      Sou bem iniciante nos códigos e acabou me surgindo uma duvida/problema a qual estou tentando resolver desde hoje cedo...
       
       Preciso criar um contêiner dentro de outro contêiner igual a imagem 1.
       
      Só que ele está ficando igual a imagem 2.
       
       Estou utilizando o bootstrap para tentar arrumar isso de uma forma que também traga a responsividade. 
      Basicamente eu criei um container fluid e dentro dele tinha outro container, só que não estou conseguindo posicionar ambos corretamente! 
       



    • By leandro32
      Senhores, me ajudem pelo amor de Deus!!!
      Estou montando uma "Base de Documentos" onde eu trabalho. Essa base é dividida por tipo de Documento (CNH/RG/OUTROS) e ano de expedição (2019/2018/2017...). As máscaras principais (HOME's) já foram feitas, o problema é que não consigo vincular esses botões dos anos em DIV's diferentes.
      Alguém, em nome de Jesus Cristo, me ajuda a criar uma regra que, ao clicar no ano 2018,  doc aparece na DIV ao lado com a barra de ZOOM??? Porque eu já estou ficando louco!!!
       
                                                                          <!-- CÓDIGO DO SITE -->
      <!DOCTYPE html>
      <html>
      <head>
      <meta charset="utf-8">
      <link rel="stylesheet" href="estilo.css" />
         
                                                    <title>ACRE - RG</title>
      </head>

      <body>
                          <!-- CABEÇALHO COM MENUS -->
      <header>
      <div class="container">
          <div class="zoom">
              <img src="logo.png" class="img-responsive" height="95px" width="130px" border="2px">
          
                <div id="menu">
                    <a href="file:///C:/Users/Info-pc/Desktop/Base%20Documental/Base%20Documental.html">HOME</a>
                    <a href="file:///C:/Users/Info-pc/Desktop/Base%20Documental/RG.html">RG</a>
                    <a href="file:///C:/Users/Info-pc/Desktop/Base%20Documental/CNH.html">CNH</a>
                    <a href="file:///C:/Users/Info-pc/Desktop/Base%20Documental/OUTROS.html">OUTROS</a>
                </div>
          </div>
      </div>
      </header>
       
          <!-- O CORPO DO SITE -->
      <div class="container2">
      <fieldset>
      <center><h2><i> Estado do ACRE - RG</i></h2></center>
      </fieldset>
      </div>

      <div class="container3">
                                                 <!-- COLUNA DOS ANOS -->

        <div class="container4">
           <div class="col-lg-2 col-md-2 col-sm-2">
             <div style="height: calc(100vh - 230px); overflow-y: scroll; overflow-x: hidden; right: 16px">
               <div class="btn-group-vertical" role="group" aria-label="..."
                   <div class="zoom">

                          <button class="btn ng-scope btn-default" ng-class="{'btn-primary': analyser.selectedDocModel.guid === docModel.guid, 'btn-default': analyser.selectedDocModel.guid !== docModel.guid}" ng-repeat="docModel in analyser.filteredDocModels" ng-click="analyser.selectDocModel(docModel)" ng-show-img="areaimagem" style="-webkit-user-drag: none" class="ng-scope" img src="AM.01.jpg" class="img-responsive" href="AM.01.jpg" size="80%">
                                              <small class="ng-binding">RG</small>
                                              <br>
                                              <small class="ng-binding">AM- 2019</small>
                                          </button>
                         
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
       

          <!-- O RODAPÉ Do SITE -->

      <footer>
              <span> <b>BASE DOCUMENTAL</b> - &copy;<i>Leandro do Nascimento Martins</i></span>
      </footer>
      </div>
      </div>
      </div>
           
      </body>
      </html>
       
       
       
                                                                             <!-- ARQUIVO ESTILO.CSS -->
      /* PADRÃO CSS */

      /* eliminando configurações dos browsers*/
      * {margin: 0;    padding: 0;    font-family: verdana, helvetica, arial;}

      /* TODAS AS TAG's DECLARADAS */ /* PARA UMA "TAG - PARTE" NORMAL, USA-SE APENAS O NOME */
      p {color: silver;    font-size: 15px;    text-align: center;    font-family: arial, "Times new roman";    text-shadow: 1px 1px 1px #111111;}

      body {background-color: #E8E8E8;    width: 100%;}

      header {background-color: #08298A;    height: 100px;    padding: 2px;    width: 100%;}

      footer   {clear: both;    color: white;    background-color: #08298A;    height: 40px;    text-align: center ;    padding: 10px;    text-shadow: 1px 1px 1px black;}

      h1 {color: SILVER;    text-align: center;    margin: 0 0 50px 0;    text-shadow: 2px 2px 2px #111111;}
      h2 {color: SILVER;    text-align: center;    margin: 5px 0 5px 0;    text-shadow: 2px 2px 2px #111111;}
       
      /* TODAS AS  ID's */    /* PARA "IDENTIFICAÇÃO - ID" DA DIV USA-SE  .#. HASHTAG  */
      #div_principal {background-color: white;    clear: both;    background-size: 65%;    min-height: 485px;    padding: 40px 0 40px 0;    margin: 1% 1% 1% 1%;    width: 100%;}
      #logo {float: left;    margin: 0 20px 0 10px;}
      #menu {float: right;    margin-top: 40px;    text-transform: uppercase;}
      #menu a {padding: 32px 20px;    text-decoration: none;    color: white;    border-radius: 20px;    border-top-right-radius: 20px;    border-bottom-left-radius: 20px;    cursor: pointer;    transition: background-color 1s;}
      #menu a:hover {background-color: white;    color: black;}
      #btn-default {text-decoration: none;}

      /* CLASS */ /* PARA CLASSES-CONTAINER's DIFERENTES USA-SE O PONTO  .  */
      .efeito {background-color: rgba(0, 0, 0, 0.3);    padding: 100px 0 100px 0;}
      .container {width: 100%; /* largura */    margin: auto; /* ajuste automatico independente de resolução*/}

      .container2 {width: 97%; /* largura */    margin: auto; /* ajuste automatico independente de resolução*/    background-color: white;}
      .container3 {width: 95%;    margin: auto;    background-color: #FFFAFA;    clear: both;}
      .container4 {width: 10%;    float: left;    background-color: #FFFAFA;    clear: both; }
      .container5 {background-color: ;     float: left;}
      .col-lg-2 {width: 95%; }
      .col-md-2 {width: 50px;}
      .col-sm-2  { width: 79px;}
      .col-lg-10  { width: 80%; }

    • By Jack Oliveira
      Ola pessoal quero tirar uma duvida aqui não sei se seria possível isso o que eu quero
       
         Teria como fazer um compartilhamento no whatsapp e no grupo do facebook ou seja este grupo seria o meu <-- seria o ex: apenas de ser meu grupo
       Bom eu tenho um arquivo chamado listagem.php
      dentro dele esta todas as informações para as pessoas verem
      e seria esta listagem.php que gostaria que ela fosse compartilhada em determinado tempo
      Dentro das meta ja tem os link para ser compartilhando a onde querer etc..
        Porem como eu disse quero definir para ele compartilhar AUTOMATICAMENTE
      Sei que o código a baixo tem nada a ver com que eu falei ai..
      Ex:
       
      <!-- ==================================================================================================================================== --> <!-- This site is optimized with the Yoast SEO --> <title><?php echo $dados["_nome"];?> - <?php echo ConfigPainel('site_cid'); ?> - <?php echo ConfigPainel('site_nome'); ?></title> <!-- ==================================================================================================================================== --> <link rel="canonical" href="<?php echo ConfigPainel('site_url'); ?>/<?php echo ConfigPainel('site_cid'); ?>/listagem/<?php echo $dados['id']; ?>/<?php echo encodeSEOString($dados['_nome']); ?>" /> <!-- ==================================================================================================================================== --> <link rel="publisher" href="https://www.facebook.com/<?php echo ConfigPainel('facebook_url'); ?>/"/> <!-- ==================================================================================================================================== --> <meta property="og:locale" content="pt_BR" /> <!-- ==================================================================================================================================== --> <meta property="og:type" content="article" /> <!-- ==================================================================================================================================== --> <meta property="og:title" content="<?php echo $dados["_nome"];?> - <?php echo ConfigPainel('site_cid'); ?> | <?php echo ConfigPainel('site_nome'); ?>" /> <!-- ==================================================================================================================================== --> <meta property="og:description" content="<?php echo $dados["_frase"];?>" /> <!-- ==================================================================================================================================== --> <meta property="og:url" content="<?php echo ConfigPainel('site_url'); ?>/<?php echo ConfigPainel('site_cid'); ?>/listagem/<?php echo $dados['id']; ?>-<?php echo encodeSEOString($dados['_nome']); ?>" /> <!-- ==================================================================================================================================== --> <meta property="og:site_name" content="Ligue Certo" /> <!-- ==================================================================================================================================== --> <meta property="article:publisher" content="https://www.facebook.com/<?php echo ConfigPainel('facebook_url'); ?>/" /> <!-- ==================================================================================================================================== --> <meta property="article:author" content="https://www.facebook.com/PROGRAMADOR" /> <!-- ==================================================================================================================================== --> <meta property="fb:app_id" content="***********" /> <!-- ==================================================================================================================================== --> <meta property="og:image" content="<?php echo ConfigPainel('site_url'); ?>/<?php echo ConfigPainel('site_cid'); ?>/images/<?php echo $dados["imagem"];?>" /> <!-- ==================================================================================================================================== --> <meta property="og:image:secure_url" content="<?php echo ConfigPainel('site_url'); ?>/<?php echo ConfigPainel('site_cid'); ?>/images/<?php echo $dados["imagem"];?>" /> <!-- ==================================================================================================================================== --> <meta property="og:image:width" content="200" /> <!-- ==================================================================================================================================== --> <meta property="og:image:height" content="200" /> <!-- ==================================================================================================================================== --> <meta name="twitter:card" content="summary" /> <!-- ==================================================================================================================================== --> <meta name="twitter:description" content="<?php echo $dados["_frase"];?>" /> <!-- ==================================================================================================================================== --> <meta name="twitter:title" content="<?php echo $dados["_nome"];?> - <?php echo ConfigPainel('site_url'); ?>/<?php echo ConfigPainel('site_cid'); ?> | <?php echo ConfigPainel('site_nome'); ?>" /> <!-- ==================================================================================================================================== --> <meta name="twitter:site" content="@liguecerto" /> <!-- ==================================================================================================================================== --> <meta name="twitter:image" content="<?php echo ConfigPainel('site_url'); ?>/<?php echo ConfigPainel('site_cid'); ?>/images/<?php echo $dados["imagem"];?>" /> <!-- ==================================================================================================================================== --> <meta name="twitter:creator" content="@nome-site" /> <!-- ==================================================================================================================================== --> Nesta compartilhamento pelo whatsapp quero que ele compartilha no numero que foi cadastro que seria do cliente da pagina
      ex: 
      https://api.whatsapp.com/send?phone=55<?php echo $celular; ?>&text=" Ola! quero que quando for feitos os cadastros pelo painel eu definir o tempo de que será feito o compartilhamento
      Ex:
      Cliente 01 <-- ele será compartilhado no whatsapp de 3 em 3 dias de 4 a 4 horas porem os seu horario sera definido
      Se for no whatsapp ele ser compartilhando apenas nos horarios de 07:00 ao 19:00 das 20:00 a 06:00 não compartilhar
      Já no Grupo do Facebook <-- Compartilhar de 2 em 2 dias de 3 a 3 horas das 06:00 as 06:00
       
      Cliente 02 <-- ele será compartilhado no whatsapp de 4 em 4 dias de 4 a 4 horas porem os seu horario sera definido
      Se for no whatsapp ele ser compartilhando apenas nos horarios de 07:00 ao 19:00 das 20:00 a 06:00 não compartilhar
      Já no Grupo do Facebook <-- Compartilhar de 3 em 3 dias de 3 a 3 horas das 06:00 as 06:00
       
      Cliente 03 <-- ele será compartilhado no whatsapp de 5 em 5 dias de 4 a 4 horas porem os seu horario sera definido
      Se for no whatsapp ele ser compartilhando apenas nos horarios de 07:00 ao 19:00 das 20:00 a 06:00 não compartilhar
      Já no Grupo do Facebook <-- Compartilhar de 4 em 4 dias de 3 a 3 horas das 06:00 as 06:00
       
      Cliente 04 <-- ele será compartilhado no whatsapp de 8 em 8 dias de 4 a 4 horas porem os seu horario sera definido
      Se for no whatsapp ele ser compartilhando apenas nos horarios de 07:00 ao 19:00 das 20:00 a 06:00 não compartilhar
      Já no Grupo do Facebook <-- Compartilhar de 5 em 5 dias de 3 a 3 horas das 06:00 as 06:00
       
      Seria mais o menos isso ai galera desculpe que ficou um carnaval de cores, mais era apenas pra dar uma definição em cada um com seus tempo..
       
        Se isso for realmente possível poderia me ajudar a fazer este código
      Eu imagino que isso seria com JAVASCRIPT e eu não tenho um bom conhecimento com javascript...
       
         Espero que vocês tenha conseguido entender a minha logica ai
    • By marcelobbt
      Estava tentando criar um leiaute com o formato GRID, mas me deparei com um problema. Não consigo colocar DIV dentro de uma DIV do leiaute do GRID.
       
      Queria saber como faço isso. Abaixo segue exemplo onde no div "col2" queria colocar duas div, uma do lado da outra:
       
      CSS
      .gridcontainer { display: grid; justify-content: center; grid-template-columns: 1fr 3fr 3fr 3fr 1fr; grid-gap: 3px; } .gridcontainer > div { /*text-align: center;*/ padding: 10px; /*font-size: 20px;*/ } .esquerda { grid-row: 1 / 5; } .direita { grid-row: 1 / 5; grid-column: 5 / 5; } .principal { grid-column: 2 / 5; background-color: #ffffff; padding-left: 10px; } HTML
      <div class="gridcontainer"> <div class="principal"> <p>texto</p> </div> <div class="col1"> <p>texto</p> </div> <div class="col2"> <div class="esquerda"> <img src="..."> <p>Imagem legenda</p> </div> <div class="direita"> <p>Texto</p> </div> </div> </div>  
       
       
    • By s3c0
      Amigo, estou com um probleminha e não consigo resolver...
       
      já revirei a internet inteira, mas não encontrei nada parecido com o que preciso.
       
      A questão é o seguinte. Queria executar um comando JS assim que uma div aparecer na tela.
       
      Abaixo estou deixando os codes
       
      <script src="js/jquery.min.js" type="text/javascript"></script> <style> #progress { width:100%; height:20px; border: solid #808080 2px; border-radius: 5px; background-image: linear-gradient( 90deg, green, yellow, red ); } #processador{ width: 0%; height: 16px; background-color: rgba(0, 0, 0, 0.5); } #memoria{ width: 0%; height: 16px; background-color: rgba(0, 0, 0, 0.5); } #hd{ width: 0%; height: 16px; background-color: rgba(0, 0, 0, 0.5); } </style> Processador <span data-bind="Usage"><div id="progress"><div id="processador"></div></div><div style="text-align:right;">20%</div></span> Memória <span data-bind="Usage"><div id="progress"><div id="memoria"></div></div><div style="text-align:right;">50%</div></span> Hard Disk <span data-bind="Usage"><div id="progress"><div id="hd"></div></div><div style="text-align:right;">80%</div></span>  
       
      JS
       
      <script type="text/javascript"> $("#processador").html(function(){ alert("ok"); var width = 1; var id = setInterval(frame, 10); var id2 = setInterval(frame2, 10); var id3 = setInterval(frame3, 10); function frame() { if (width >= 20) { clearInterval(id); } else { width++; document.getElementById("processador").style.width = width + '%'; } } function frame2() { if (width >= 50) { clearInterval(id2); } else { width++; document.getElementById("memoria").style.width = width + '%'; } } function frame3() { if (width >= 80) { clearInterval(id3); } else { width++; document.getElementById("hd").style.width = width + '%'; } } }); </script>  
      A "animação" em si, está funcionando perfeitamente, porém ao carregar a página e não no momento em que a DIV aparece na tela
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.