Salve guerreiros. Antes de carregar a página eu tenho um loading circular que funciona perfeitamente antes de abrir a página da internet. Acontece que eu inseri um loading svg e agora o novo loading é exibido mas não carrega a página (fica eternamente no loading). Destaquei em azul o novo svg adicionado. Alguém poderia me dar um norte. Obrigado.
Pergunta
srpenteado
Salve guerreiros. Antes de carregar a página eu tenho um loading circular que funciona perfeitamente antes de abrir a página da internet. Acontece que eu inseri um loading svg e agora o novo loading é exibido mas não carrega a página (fica eternamente no loading). Destaquei em azul o novo svg adicionado. Alguém poderia me dar um norte. Obrigado.
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Plataforma</title>
<link rel="icon" sizes="192x192" href="/icon.png">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="app.css">
</head>
<body>
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="200.000000pt" height="200.000000pt" viewBox="0 0 200.000000 200.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,200.000000) scale(0.100000,-0.100000)"
>
<path d="M964 1916 c-27 -12 -48 -46 -144 -227 -62 -118 -130 -245 -150 -284
-41 -77 -185 -349 -260 -490 -27 -49 -121 -227 -211 -395 -183 -344 -188 -360
-131 -411 23 -21 43 -29 69 -29 32 0 47 11 137 98 601 584 727 702 740 695 8
-4 184 -174 392 -378 207 -203 391 -380 407 -392 69 -51 167 -5 167 78 0 12
-28 74 -61 138 -34 64 -82 154 -107 201 -24 47 -61 117 -82 155 -37 69 -88
165 -178 335 -24 47 -61 117 -82 155 -75 140 -130 244 -225 425 -159 301 -164
311 -201 326 -40 17 -41 17 -80 0z m96 -408 c29 -57 56 -107 60 -113 4 -5 40
-73 80 -150 40 -77 80 -153 90 -170 10 -16 50 -93 90 -170 40 -77 82 -156 93
-175 22 -36 -161 130 -313 285 -41 42 -87 83 -102 91 -59 31 -106 14 -183 -66
-101 -104 -348 -334 -338 -315 6 11 73 137 149 280 235 444 264 498 292 553
14 28 27 52 28 52 1 0 26 -46 54 -102z"/>
<path d="M539 251 c-23 -23 -29 -38 -29 -71 0 -33 6 -48 29 -71 l29 -29 436 0
436 0 32 29 c27 24 33 36 33 71 0 35 -6 47 -33 71 l-32 29 -436 0 -436 0 -29
-29z"/>
</g>
</svg>
<script id="loadScript" src="load.js"></script>
</body>
</html>
AQUI TEMOS O DETELHE DO APP.CSS APONTADO PARA O NOVO SVG
svg {
width: 100%; /*posição*/
heigth: 100%; /*posição*/
fill: transparent; /*preenchimento*/
stroke: black; /*contorno*/
stroke-width: 19px; /*expessura*/
stroke-dasharray: 6750; /*fracionar contorno*/
stroke-dashoffset: 0;
animation: 2s desenha infinite alternate;
}
@keyframes desenha {
from {
stroke-dashoffset: 6750;
}
to {
stroke-dashoffset: 0;
}
}
Link para o comentário
Compartilhar em outros sites
0 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.