Ir para conteúdo
danicarla

Zoom demorando pra ser aplicado na pagina

Por , em Desenvolvimento frontend

Recommended Posts

danicarla    3

danicarla
Postado

Oi pessoal tudo bem?
Eu estou usando um zoom no meu site, porém quando a pagina é um pouco mais pesada, ele carrega a pagina primeiro e depois dá o zoom.. como se o zom fosse aplicado atrasado na pagina...

Será que consigo carregar a pagina já com o zoom aplicado?
Meu código atualmente  é esse:
  

<script>
function ZoomTeste() {
	document.body.style.zoom = '140%';
}
</script>
</head>
<body onload="ZoomTeste();">

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora
Ir para a lista de tópicos Desenvolvimento frontend

  • Conteúdo Similar

    • Motta
      'Zoombombing' targeted with new version of app
      Por Motta
      'Zoombombing' targeted with new version of app
    • digonaweb
      Ajuda com formatação de texto
      Por digonaweb
      Boa tarde,
       
      Semanas atrás estava com um problema em um script de um widget de relógio para um site.
       
      Consegui um novo script sem o link que estava gerando um erro, porém gostaria de utilizar a formatação do texto similar a do anexo.
       
      Alguém pode me ajudar com a alteração no código?
       
      <div id="clockbox" style="text-align:center;"></div>
       
      <script type="text/javascript">
       
      var tmonth=["January","February","March","April","May","June","July","August","September","October","November","December"];
      function GetClock(){
      var tzOffset = -3;
      var d=new Date();
      var dx=d.toGMTString();
      dx=dx.substr(0,dx.length -3);
      d.setTime(Date.parse(dx))
      d.setHours(d.getHours()+tzOffset);
      var nmonth=d.getMonth(),ndate=d.getDate(),nyear=d.getFullYear();
      var nhour=d.getHours(),nmin=d.getMinutes(),ap;
      if(nhour==0){ap=" AM";nhour=12;}
      else if(nhour<12){ap=" AM";}
      else if(nhour==12){ap=" PM";}
      else if(nhour>12){ap=" PM";nhour-=12;}
      if(nmin<=9) nmin="0"+nmin;
      var clocktext=""+tmonth[nmonth]+" "+ndate+", "+nyear+" "+nhour+":"+nmin+ap+"";
      document.getElementById('clockbox').innerHTML=clocktext;
      }
       
      GetClock();
      setInterval(GetClock,1000);
       
      </script>
       
      Obrigado!
       
       

    • leandro32
      Botão que chama Imagem em DIVs Diferentes
      Por 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%; }

    • Eliseu Filipi
      Fontes externas não funcionam
      Por Eliseu Filipi
      Olá
      Minhas fontes (em formato de ícones) não funcionam em sites externos e não estou entendendo por que.
       
      Segue o link aqui do site de exemplo. Segue a baixo a referencia da fonte:
      <link rel="stylesheet" href="https://www.fontgold.com//fonts/style.css">  
      O interessante é que as fontes funcionam apenas no site onde estão armazenadas não para outros.
      O que está errado e como resolver? 
       
      Desde já agradeço.
    • isaque_cb2
      Edição de template
      Por isaque_cb2
      Olá! eu estava aqui fazendo meu site, quando me deparei com o problema de fazer um menu "bonito" baixei este template depois de ver o exemplo na net, mas ele é muito complicado pra mim, não sou profissional (mas sou programador iniciante em c#)
      TEMPLATE
      mas se alguém puder me ajudar a criar uma pagina deste tipo, sem tantos códigos, eu agradeço, pois do jeito que está eu não consigo nem alterar as cores...
      pode ser com tutoriais, dicas, videos, etc...
       
      ~Grato desde já~
×

Informação importante

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

  Aceito