Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Jefferson Androcles

Executar script apos carregar pagina!

Recommended Posts

Olá meu nome é Jefferson Androcles, pessoal estou com um problemão, pode ser algo simples para alguns, só que eu não entendo quase nada de js, eu peguei um efeito de notificação bem bacana, só que para utilizar eu tenho que aperta um botão para a notificação com o seu efeito aparecer, tentei resolver... mas não deu não... pessoal antes de tudo muito obrigado.

 

 

código:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Notification Styles Inspiration | Attached Bouncy Flip</title>
        <link rel="stylesheet" type="text/css" href="css/ns-default.css" />
        <link rel="stylesheet" type="text/css" href="css/ns-style-attached.css" />
        <script src="js/modernizr.custom.js"></script>
        <!--[if IE]>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>
    <body bgcolor="#A8A8A8">
                
                    <button id="notification-trigger" class="progress-button">
                    Ver
                    </button>
        
        
        <script src="js/classie.js"></script>
        <script src="js/notificationFx.js"></script>
        <script>
            (function() {
                var bttn = document.getElementById( 'notification-trigger' );
                // make sure..
                bttn.disabled = false;
                bttn.addEventListener( 'click', function() {
                    // simulate loading (for demo purposes only)
                    classie.add( bttn, 'active' );
                    setTimeout( function() {
                        classie.remove( bttn, 'active' );
                        
                        // create the notification
                        var notification = new NotificationFx({
                            message : '<span class="icon icon-calendar"></span><p>The event was added to your calendar. Check out all your events in your <a href="#">event overview</a>.</p>',
                            layout : 'attached',
                            effect : 'bouncyflip',
                            ttl : 5000,
                            type : 'notice', // notice, warning or error
                            onClose : function() {
                                bttn.disabled = false;
                            }
                        });
                        // show the notification
                        notification.show();
                    }, 0 );
                    
                    // disable the button (for demo purposes only)
                    this.disabled = true;
                } );
            })();
        </script>
    </body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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