Crazy Pop-up [Javascript]

Crazy Pop-up

Publicado por Thiago (última atualização em 31/07/2010)

[ Hits: 7.085 ]

Download crazypopup.html

0 0

Denuncie Favoritos Indicar

Neste exemplo utilizo algumas características avançadas do JavaScript como captura de eventos, funções de call-back, mudança de estilo CSS.

Abraço a todos.

Esconder código-fonte

<!--
   Autor: thiagoamm
   Data: 15/08/2009
 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      <title>Untitled Document</title>
      
      <style type="text/css" media="all">
                  
         .estilo1 {
            color: #000;
            background: #fff;
         }
         
         .estilo2 {
            color: #fff;
            background: #000;
         }
         
      </style>
      
      <script type="text/javascript">
         
         var x = 0;
         
         function moveToRight() {
            if (x > (screen.width - 200)) {
               x = 0;
            }
                        
            if (x % 2 == 0) {               
                  document.body.className = "estilo2";               
            } else {
                  document.body.className = "estilo1";            
            }
            
            window.moveTo(x += 5, 0);
            setTimeout(moveToRight, 70);
         }
                  
         window.onload = function() {
            this.document.title = "Teste Pop-up";
            this.document.body.className = "estilo1";
            this.moveTo(0, 0);
            this.resizeTo(200, 200);
            moveToRight();                        
         }
            
         window.onbeforeunload = function() {
            alert("Obrigado pela visita!");
         }
                  
      </script>
      
   </head>
   <body>
      Bem vindo ao Site!!!
   </body>
</html>

Scripts recomendados

Comentários

[1] Comentário enviado por /bin/laden em 31/07/2010 - 18:04h

Cara talvez você possa me ajudar com a seguinte dúvida:

É possível carregar uma função dum script externo, tipo

cat blablabla.js

function mostraMensagem() {
window.alert('Hello World!');
}

E na minha página html:

<script type="text/javascript" src="scripts/blablabla.js"></script>
...
<form><input type=button value="Teste" onClick="javascript:mostraMensagem()"></form>

Isso seria possível? (postei essa pergunta no vol mas até hoje ainda não obtive resposta!)

0 0

[2] Comentário enviado por thiagoamm em 01/08/2010 - 23:52h

Sim é possível.

0 0

[3] Comentário enviado por /bin/laden em 02/08/2010 - 08:49h

Mas como... Tentei do jeito que mostrei, porém não funcionou!

0 0

[4] Comentário enviado por thiagoamm em 02/08/2010 - 14:16h

Neste tutorial o autor explica como referenciar arquivos css e javascript que são externos a uma página.
http://tableless.com.br/artigos/tutorial/?cont=6

0 0