Commit 7e4101978a31c550402fcfa5dd7a29f4abedf2f4
1 parent
6fa34ad0
Exists in
master
and in
7 other branches
Exemplo de como criar janelas flutuantes e janelas de aguarde
Showing
2 changed files
with
94 additions
and
0 deletions
Show diff stats
exemplos/index.html
| ... | ... | @@ -46,6 +46,7 @@ body,td |
| 46 | 46 | <p><b>Cálculos</b></p> |
| 47 | 47 | <p><a href="calculo1.htm" target="_blank" >Distâncias</a></p> |
| 48 | 48 | <p><b>Guias, janelas, barras de botões</b></p> |
| 49 | +<p><a href="janelas.htm" target="_blank" >Opções de criação de janelas flutuantes</a></p> | |
| 49 | 50 | <p><a href="guias1.htm" target="_blank" >Retorna à guia padrão após adicionar um tema</a></p> |
| 50 | 51 | <p><a href="botoes1.htm" target="_blank" >Barra apenas com os ícones</a></p> |
| 51 | 52 | <p><b>Legenda</b></p> | ... | ... |
| ... | ... | @@ -0,0 +1,93 @@ |
| 1 | +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> | |
| 2 | +<html> | |
| 3 | +<head> | |
| 4 | +<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1"> | |
| 5 | +<script type="text/javascript" src="../classesjs/i3geonaocompacto.js"></script> | |
| 6 | + | |
| 7 | +</head> | |
| 8 | +<body id="i3geo" style=background-color:white;padding:20px; > | |
| 9 | +<div class=paragrafo style=top:50px; > | |
| 10 | +<p class=paragrafo > | |
| 11 | +<b>Cria uma janela de aguarde padrão</b><br></br> | |
| 12 | +<input class=aplicar type="button" value="Abrir" onclick="aguardePadrao()" /> | |
| 13 | +<input class=aplicar type="button" value="Fechar" onclick="fechaPadrao()" /> | |
| 14 | +</p> | |
| 15 | +<p class=paragrafo > | |
| 16 | +<b>Cria uma janela de aguarde reduzida</b><br></br> | |
| 17 | +<input class=aplicar type="button" value="Abrir" onclick="aguardeReduzida()" /> | |
| 18 | +<input class=aplicar type="button" value="Fechar" onclick="fechaReduzida()" /> | |
| 19 | +</p> | |
| 20 | +<p class=paragrafo > | |
| 21 | +<b>Cria uma janela de aguarde mínima</b><br></br> | |
| 22 | +<input class=aplicar type="button" value="Abrir" onclick="aguardeMinima()" /> | |
| 23 | +<input class=aplicar type="button" value="Fechar" onclick="fechaMinima()" /> | |
| 24 | +</p> | |
| 25 | +<p class=paragrafo > | |
| 26 | +<b>Cria uma janela flutuante com um iframe dentro</b><br></br> | |
| 27 | +<input class=aplicar type="button" value="Abrir" onclick="flutuanteIframe()" /> | |
| 28 | +</p> | |
| 29 | +<p class=paragrafo > | |
| 30 | +<b>Cria uma janela flutuante sem iframe</b><br></br> | |
| 31 | +<input class=aplicar type="button" value="Abrir" onclick="flutuante()" /> | |
| 32 | +</p> | |
| 33 | +</div> | |
| 34 | +<script type="text/javascript"> | |
| 35 | +i3GEO.configura.locaplic = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo"; | |
| 36 | +var g_localimg = i3GEO.util.protocolo()+"://"+window.location.host+"/i3geo/imagens"; | |
| 37 | +i3GEO.cria(); | |
| 38 | +i3GEO.inicia(); | |
| 39 | +i3GEO.ajuda.ATIVAJANELA = false | |
| 40 | +function aguardePadrao(){ | |
| 41 | + i3GEO.janela.ESTILOAGUARDE = "normal"; | |
| 42 | + i3GEO.janela.abreAguarde("normal","Espere..."); | |
| 43 | + document.body.style.cursor = "default"; | |
| 44 | + YAHOO.aguarde.normal.moveTo(200,100); | |
| 45 | +} | |
| 46 | +function fechaPadrao(){ | |
| 47 | + i3GEO.janela.fechaAguarde("normal"); | |
| 48 | +} | |
| 49 | +function aguardeReduzida(){ | |
| 50 | + i3GEO.janela.ESTILOAGUARDE = "reduzida"; | |
| 51 | + i3GEO.janela.abreAguarde("reduzida","Espere..."); | |
| 52 | + document.body.style.cursor = "default"; | |
| 53 | +} | |
| 54 | +function fechaReduzida(){ | |
| 55 | + i3GEO.janela.fechaAguarde("reduzida"); | |
| 56 | +} | |
| 57 | +function aguardeMinima(){ | |
| 58 | + i3GEO.janela.ESTILOAGUARDE = "minima"; | |
| 59 | + i3GEO.janela.abreAguarde("minima","Espere..."); | |
| 60 | + document.body.style.cursor = "default"; | |
| 61 | +} | |
| 62 | +function fechaMinima(){ | |
| 63 | + i3GEO.janela.fechaAguarde("minima"); | |
| 64 | +} | |
| 65 | +function flutuanteIframe(){ | |
| 66 | + i3GEO.janela.cria("500px","500px",i3GEO.configura.locaplic+"/ferramentas/googlemaps/index.php","","","Google maps <a class=ajuda_usuario target=_blank href='"+i3GEO.configura.locaplic+"/ajuda_usuario.php?idcategoria=7&idajuda=68' > </a>"); | |
| 67 | +} | |
| 68 | +function flutuante(){ | |
| 69 | + titulo = "Título da janela com link <a class=ajuda_usuario target=_blank href='" + i3GEO.configura.locaplic + "/ajuda_usuario.php?idcategoria=3&idajuda=24' > </a>"; | |
| 70 | + cabecalho = function(){alert("Vc clicou no cabeçalho da janela");}; | |
| 71 | + minimiza = function(){ | |
| 72 | + i3GEO.janela.minimiza("testaJanela"); | |
| 73 | + }; | |
| 74 | + janela = i3GEO.janela.cria( | |
| 75 | + "400px", | |
| 76 | + "180px", | |
| 77 | + "", | |
| 78 | + "", | |
| 79 | + "", | |
| 80 | + titulo, | |
| 81 | + "testaJanela", | |
| 82 | + false, | |
| 83 | + "hd", | |
| 84 | + cabecalho, | |
| 85 | + minimiza | |
| 86 | + ); | |
| 87 | + divid = janela[2].id; | |
| 88 | + $i(divid).innerHTML = "Esse é o texto que vai dentro da janela. Vc pode incluir qualquer coisa aqui." | |
| 89 | +} | |
| 90 | +</script> | |
| 91 | +</body> | |
| 92 | + | |
| 93 | +</html> | |
| 0 | 94 | \ No newline at end of file | ... | ... |