Compartilhe
Ir em baixo
avatar

Mensagens : 1912
Pontos : 11718
Evolução : 50

Ver perfil do usuário

[Tutorial]Criando seu Site de WoW #2

em Dom 2 Set 2012 - 11:29
Reputação da mensagem: 100% (4 votos)

Seta Aula #2
Seta Creditos - Fox - t[]b@_$ERB|@
Seta Nome - Concluindo as paginas PHP
Seta Proxima aula - [Você precisa estar registrado e conectado para ver este link.]
Na ultima aula elaboramos as paginas, Config, Index, e HTML.

Hoje vamos elaborar a pagina Obrigado.php, e a pagina erro.php.



Crie um novo projeto e adicione o seguinte código
Código:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
   <meta charset="UTF-8">
   <title><?php echo $site_name ?></title>
   
   <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
          <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
</head>
<body>

   <h1><?php echo $site_name ?></h1>
   
   <form action="" method="get" name="error" class="general" id="error">
     Obrigado por se registrar.
</form>
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
   <script>
      $(function(){
         if( $.browser.msie && $.browser.version < 9 ) {
            $('html').addClass('ie');
            
            $('div.option-group').each(function(){
               var $this = $(this);
               
               $this.find('label').append('<span class="before"></span> <span class="after"></span>');
               
               // botão radio
               if( $this.hasClass('radio') ) {
                  $this.delegate('input[type="radio"]', 'click', function(){
                     if( this.checked ) {
                        $(this).siblings('label').removeClass('checked').end().next('label').addClass('checked');
                     }
                     else {
                        $(this).next('label').removeClass('checked');
                     }
                  });
               }
               
               // Aplica o stilo na chekbox
               else if( $this.hasClass('check') ) {
                  $this.delegate('input[type="checkbox"]', 'click', function(){
                     if( this.checked ) {
                        $(this).next('label').addClass('checked');
                     }
                     else {
                        $(this).next('label').removeClass('checked');
                     }
                  });
               }
            });            
            
         }
         
         
         // seleciona a box do radio
         if( $.browser.msie && $.browser.version <= 9 ) {
            $('html').addClass('ie9');
            
            $('form.general')
               .find('select')
               .css({ 'opacity': '0', 'position': 'relative', 'z-index': '10' })
               .after('<span class="selectTop"/>')
               .change(function(){
                  $(this).next().text( $('option:selected', this).text() );
               })
               .trigger('change');
         }
         
         // adiciona 'invalid' em caso do html5 der fail.
         if( !$.browser.firefox ) {
            $('form.general').each(function(){
               $(this).find('input.form-input').bind('invalid', function(){
                  $(this).addClass('invalid');
               });
            });
         }
      });
   </script>
</body>
</html>
Salve-o, dentro da pasta Include, como "obrigado.html"

Abra um novo projeto, e adicione o seguinte código.

Código:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
   <meta charset="UTF-8">
   <title><?php echo $site_name ?></title>
   
   <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>


          <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
   
</head>
<body>

   <h1><?php echo $site_name ?></h1>
   
   <form action="" method="get" name="error" class="general" id="error">
    Ocorreu algum erro no seu registro, tente novamente.
</form>
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
   <script>
      $(function(){
         if( $.browser.msie && $.browser.version < 9 ) {
            $('html').addClass('ie');
            
            $('div.option-group').each(function(){
               var $this = $(this);
               
               $this.find('label').append('<span class="before"></span> <span class="after"></span>');
               
               // botão radio
               if( $this.hasClass('radio') ) {
                  $this.delegate('input[type="radio"]', 'click', function(){
                     if( this.checked ) {
                        $(this).siblings('label').removeClass('checked').end().next('label').addClass('checked');
                     }
                     else {
                        $(this).next('label').removeClass('checked');
                     }
                  });
               }
               
               // estilo da checkbox
               else if( $this.hasClass('check') ) {
                  $this.delegate('input[type="checkbox"]', 'click', function(){
                     if( this.checked ) {
                        $(this).next('label').addClass('checked');
                     }
                     else {
                        $(this).next('label').removeClass('checked');
                     }
                  });
               }
            });            
            
         }
         
         
         // seleciona o estilo da box
         if( $.browser.msie && $.browser.version <= 9 ) {
            $('html').addClass('ie9');
            
            $('form.general')
               .find('select')
               .css({ 'opacity': '0', 'position': 'relative', 'z-index': '10' })
               .after('<span class="selectTop"/>')
               .change(function(){
                  $(this).next().text( $('option:selected', this).text() );
               })
               .trigger('change');
         }
         
         // adiciona 'invalido' caso der fail no html5
         if( !$.browser.firefox ) {
            $('form.general').each(function(){
               $(this).find('input.form-input').bind('invalid', function(){
                  $(this).addClass('invalid');
               });
            });
         }
      });
   </script>
</body>
</html>

Salve-o como error.php .

Pronto,
as paginas de sucesso e sem sucesso foram adicionadas.
na nossa proxima aula vamos adicionar o css que fará o "DESIGN" da nossa pagina.

Até mais.
avatar

Mensagens : 567
Pontos : 2728
Ver perfil do usuáriohttp://www.northeastgames.tk

Re: [Tutorial]Criando seu Site de WoW #2

em Ter 4 Set 2012 - 20:11
Brigadão fox por ajudar agente com nossos websites, +rep pra ti!!!
avatar

Mensagens : 35
Pontos : 105
Ver perfil do usuário

Re: [Tutorial]Criando seu Site de WoW #2

em Qua 5 Set 2012 - 0:47
Olá bom dia
Eu estou montando um server de wow, com o hamachi e tentando usar o Joomla para montar o site, quando eu coloco os dados no PhpMysql substituindo o Root pela pasta do Joomla acontece q nao estou consiguindo encontrar o nome do banco de dados para dar os passos seguintes da configuração, o Repack do Nerdzinho é otimo, mas na hora de configurar o site e tirar o bug do HP estou tendo problemas, ficarei muito grato se a equipe do BG me instruisse, pois sou novo na area. Desde ja Fico muito grato a todos.
avatar

Mensagens : 52
Pontos : 212
Ver perfil do usuário

Re: [Tutorial]Criando seu Site de WoW #2

em Qua 5 Set 2012 - 1:47
Ixi cara acho que vc esta querendo tirar duvidas em lugares errados, se eu fosse vc abriria um topico pra tirar duvidas...E tu hein FOX hehe voltou pra BG Games apavorando...+ rep pela ajuda na criaçao de site
avatar

Mensagens : 35
Pontos : 105
Ver perfil do usuário

Re: [Tutorial]Criando seu Site de WoW #2

em Qua 5 Set 2012 - 9:26
Valeu ae mesmo Tirissa 1985
Conteúdo patrocinado

Re: [Tutorial]Criando seu Site de WoW #2

Voltar ao Topo
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum