Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais
Conectar-se

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Os membros mais ativos da semana
Luiz
 
Harleen
 
Marcelo22m2
 
Kyo Panda
 
paulim78
 
Lincoln
 
APOllO
 
Shek
 
>.< T-T =3
 
b@nzé
 

Quem está conectado
294 usuários online :: 5 usuários cadastrados, Nenhum Invisível e 289 Visitantes :: 2 Motores de busca

Daemon, Harleen, Kyo Panda, Marcelo22m2, paulim78

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Página inicial para servidor de SA-MP

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Página inicial para servidor de SA-MP

Mensagem por PrisoN†BreaK em 01/12/15, 12:38 pm

Detalhes da questão


Endereço do fórum: http://tatudm.forumeiros.com/forum
Versão do fórum: PhpBB3

Descrição


Código:


<!DOCTYPE html>
<html lang="en" class="no-js">
  <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Editavel</title>
      <meta name="description" content="Editavel" />
      <meta name="keywords" content="SA:MP - RPG" />
      <meta name="author" content="Codrops" />
      <link rel="shortcut icon" href="http://asusgames.esy.es/cloud.ico">
                <link rel="stylesheet" href="http://asusgames.esy.es/MyCSS.css" type="text/css" media="screen"/>
      <script src="http://asusgames.esy.es/CSS/modernizr.custom.js"></script>
  </head>
<style>
  /* General styles for all menus */
.cbp-spmenu {
  background: #163c52;
  position: fixed;
}

.cbp-spmenu h3 {
  color: #afdefa;
  font-size: 1.9em;
  padding: 20px;
  margin: 0;
  font-weight: 300;
  background: #0d77b6;
}

.cbp-spmenu a {
  display: block;
  color: #fff;
  font-size: 1.1em;
  font-weight: 300;
}

.cbp-spmenu a:hover {
  background: #1c5f85;
}

.cbp-spmenu a:active {
  background: #afdefa;
  color: #0f354b;
}

/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {
  width: 240px;
  height: 100%;
  top: 0;
  z-index: 1000;
}

.cbp-spmenu-vertical a {
  border-bottom: 1px solid #1c5f85;
  padding: 1em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.cbp-spmenu-horizontal {
  width: 100%;
  height: 150px;
  left: 0;
  z-index: 1000;
  overflow: hidden;
}

.cbp-spmenu-horizontal h3 {
  height: 100%;
  width: 20%;
  float: left;
}

.cbp-spmenu-horizontal a {
  float: left;
  width: 20%;
  padding: 0.8em;
  border-left: 1px solid #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {
  left: -240px;
}

.cbp-spmenu-right {
  right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
  left: 0px;
}

.cbp-spmenu-right.cbp-spmenu-open {
  right: 0px;
}

/* Horizontal menu that slides from the top or bottom */

.cbp-spmenu-top {
  top: -150px;
}

.cbp-spmenu-bottom {
  bottom: -150px;
}

.cbp-spmenu-top.cbp-spmenu-open {
  top: 0px;
}

.cbp-spmenu-bottom.cbp-spmenu-open {
  bottom: 0px;
}

/* Push classes applied to the body */

.cbp-spmenu-push {
  overflow-x: hidden;
  position: relative;
  left: 0;
}

.cbp-spmenu-push-toright {
  left: 240px;
}

.cbp-spmenu-push-toleft {
  left: -240px;
}

/* Transitions */

.cbp-spmenu,
.cbp-spmenu-push {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* Example media queries */

@media screen and (max-width: 55.1875em){

  .cbp-spmenu-horizontal {
      font-size: 75%;
      height: 110px;
  }

  .cbp-spmenu-top {
      top: -110px;
  }

  .cbp-spmenu-bottom {
      bottom: -110px;
  }

}

@media screen and (max-height: 26.375em){

  .cbp-spmenu-vertical {
      font-size: 90%;
      width: 190px;
  }

  .cbp-spmenu-left,
  .cbp-spmenu-push-toleft {
      left: -190px;
  }

  .cbp-spmenu-right {
      right: -190px;
  }

  .cbp-spmenu-push-toright {
      left: 190px;
  }
}
  /* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
  font-family: 'fontawesome';
  src:url('../fonts/fontawesome.eot');
  src:url('../fonts/fontawesome.eot?#iefix') format('embedded-opentype'),
  url('http://asusgames.esy.es/CSS/fontawesome.svg#fontawesome') format('svg'),
      url('http://asusgames.esy.es/CSS/fontawesome.woff') format('woff'),
      url('http://asusgames.esy.es/CSS/fontawesome.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body, html { font-size: 100%;    padding: 0; margin: 0;}

/* Reset */
*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}
#lixo {
display:none;
}
body {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #0f354b;
    background: #273749 url("http://i68.servimg.com/u/f68/19/22/11/16/untitl10.jpg") top no-repeat;
}

a {
  color: #f0f0f0;
  text-decoration: none;
}


.main,
.container > header {
  width: 90%;
  max-width: 69em;
  margin: 0 auto;
  padding: 0 1.875em 3.125em 1.875em;
}

.container > header {
  padding: 2.875em 1.875em 1.875em;
}

.container > header h1 {
  font-size: 2.125em;
  line-height: 1.3;
  margin: 0;
  float: left;
  font-weight: 400;
}

.container > header span {
  display: block;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  padding: 0 0 0.6em 0.1em;
}

.container > header nav {
  float: right;
}

.container > header nav a {
  display: block;
  float: left;
  position: relative;
  width: 2.5em;
  height: 2.5em;
  background: #fff;
  border-radius: 50%;
  color: transparent;
  margin: 0 0.1em;
  border: 4px solid #0f354b;
  text-indent: -8000px;
}

.container > header nav a:after {
  content: attr(data-info);
  color: #0f354b;
  position: absolute;
  width: 600%;
  top: 120%;
  text-align: right;
  right: 0;
  opacity: 0;
  pointer-events: none;
}

.container > header nav a:hover:after {
  opacity: 1;
}

.container > header nav a:hover {
  background: #0f354b;
}

.main > section {
  max-width: 260px;
  width: 90%;
  margin: 0 auto;
}

.main > section h2 {
  font-weight: 300;
  color: #ccc;
}

.main > section button {
  border: none;
  background: #0f354b;
  color: #fff;
  padding: 1.5em;
  display: block;
  width: 100%;
  cursor: pointer;
  margin: 10px 0;
  font-size: 0.8em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button:hover {
  background: #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button.active {
  background: #0d77b6;
}

.main > section button.disabled {
  background: #aaa;
  pointer-events: none;
}

.icon-drop:before,
.icon-arrow-left:before {
  font-family: 'fontawesome';
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  speak: none;
  font-style: normal;
  font-weight: normal;
  line-height: 2;
  text-align: center;
  color: #0f354b;
  -webkit-font-smoothing: antialiased;
  text-indent: 8000px;
  padding-left: 8px;
}

.container > header nav a:hover:before {
  color: #fff;
}

.icon-drop:before {
  content: "\e000";
}

.icon-arrow-left:before {
  content: "\f060";
}
span.eddyeowna{
            background: #0f354b;
                                position:fixed;
            right:0px;
            bottom:30px;
            font-size:12px;
              -webkit-animation-name: bounceInDown;
                  animation-name: bounceInDown;
}
        span.eddyeowna a{
            color:#fff;
            text-transform:uppercase;
            text-decoration:none;
            margin-right:30px;
}
        span.eddyeowna a:hover{
            color:#000;
}
                  </style>
  <body class="cbp-spmenu-push">
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
        <h3>Fórum</h3>
                  <a href="/forum">Acessar</a>
                  <a href="/login">Logar</a>
                  <a href="/register">Registrar-se</a>
      </nav>
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2">
        <h3>Servidores</h3>
        <a href="samp://editavel">SA-MP</a>
    
      </nav>
      <div class="container">
        <header class="clearfix">
            <span class="animated BounceInUp">BEM-VINDO AO FÓRUM DO SERVIDOR TATU DM</span>
        </header>
        <div class="main">
            <section class="buttonset">
                                  <center><h2><span class="animated BounceInUp">ACESSO RÁPIDO</span></h2></center>
              <!-- Class "cbp-spmenu-open" gets applied to menu and "cbp-spmenu-push-toleft" or "cbp-spmenu-push-toright" to the body -->
              <button id="showLeftPush" class="animated bounceInUp">Fórum</button>
              <button id="showRightPush" class="animated bounceInDown">Servidores</button>
            </section>
        </div>
      </div>
            <span class="eddyeowna">
  
      <!-- Classie - class helper functions by @desandro https://github.com/desandro/classie -->
      <script src="http://asusgames.esy.es/CSS/classie.js"></script>
      <script>
        var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
            menuRight = document.getElementById( 'cbp-spmenu-s2' ),
            menuTop = document.getElementById( 'cbp-spmenu-s3' ),
            menuBottom = document.getElementById( 'cbp-spmenu-s4' ),
            showLeft = document.getElementById( 'showLeft' ),
            showRight = document.getElementById( 'showRight' ),
            showTop = document.getElementById( 'showTop' ),
            showBottom = document.getElementById( 'showBottom' ),
            showLeftPush = document.getElementById( 'showLeftPush' ),
            showRightPush = document.getElementById( 'showRightPush' ),
            body = document.body;
        showLeftPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toright' );
            classie.toggle( menuLeft, 'cbp-spmenu-open' );
            disableOther( 'showLeftPush' );
        };
        showRightPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toleft' );
            classie.toggle( menuRight, 'cbp-spmenu-open' );
            disableOther( 'showRightPush' );
        };

        function disableOther( button ) {
            if( button !== 'showLeft' ) {
              classie.toggle( showLeft, 'disabled' );
            }
            if( button !== 'showRight' ) {
              classie.toggle( showRight, 'disabled' );
            }
            if( button !== 'showTop' ) {
              classie.toggle( showTop, 'disabled' );
            }
            if( button !== 'showBottom' ) {
              classie.toggle( showBottom, 'disabled' );
            }
            if( button !== 'showLeftPush' ) {
              classie.toggle( showLeftPush, 'disabled' );
            }
            if( button !== 'showRightPush' ) {
              classie.toggle( showRightPush, 'disabled' );
            }
        }
      </script>
          <div id="lixo">
      <a href="http://www.forumeiros.com" target="_blank">forumeiros.com</a>
      </div>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script language=JavaScript>
<!--
var mensagem="";
function clickIE() {if (document.all) {(mensagem);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(mensagem);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
  <script language="JavaScript">
    function protegercodigo() {
    if (event.button==2||event.button==3){
    }
    document.onmousedown=protegercodigo
</script>
  </body>
</html>

Eu gostaria de uma pagina inicial tipo essa:


Mais com o tema do natal, alguém pode mim ajuda?
avatar

PrisoN†BreaK
Membro do Fórum

Masculino
Inscrito dia : 23/10/2015
Mensagens : 1100
Pontos Ativos : 1550

http://brasilplayfreedomofc.forumeiros.com/forum

Resolvido Re: Página inicial para servidor de SA-MP

Mensagem por Hancki em 01/12/15, 05:53 pm

Olá!

Pode ser mais específico relativamente às mudanças que deseja fazer para algo natalício?

Hancki
avatar

Hancki
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8041
Pontos Ativos : 12015

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Página inicial para servidor de SA-MP

Mensagem por IsmaelS. em 01/12/15, 05:57 pm

Boa noite!

Assim amigo?
Código:


<!DOCTYPE html>
<html lang="en" class="no-js">
  <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Editavel</title>
      <meta name="description" content="Editavel" />
      <meta name="keywords" content="SA:MP - RPG" />
      <meta name="author" content="Codrops" />
      <link rel="shortcut icon" href="http://asusgames.esy.es/cloud.ico">
                <link rel="stylesheet" href="http://asusgames.esy.es/MyCSS.css" type="text/css" media="screen"/>
      <script src="http://asusgames.esy.es/CSS/modernizr.custom.js"></script>
  </head>
<style>
  /* General styles for all menus */
.cbp-spmenu {
  background: #163c52;
  position: fixed;
}

.cbp-spmenu h3 {
  color: #afdefa;
  font-size: 1.9em;
  padding: 20px;
  margin: 0;
  font-weight: 300;
  background: #0d77b6;
}

.cbp-spmenu a {
  display: block;
  color: #fff;
  font-size: 1.1em;
  font-weight: 300;
}

.cbp-spmenu a:hover {
  background: #1c5f85;
}

.cbp-spmenu a:active {
  background: #afdefa;
  color: #0f354b;
}

/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {
  width: 240px;
  height: 100%;
  top: 0;
  z-index: 1000;
}

.cbp-spmenu-vertical a {
  border-bottom: 1px solid #1c5f85;
  padding: 1em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.cbp-spmenu-horizontal {
  width: 100%;
  height: 150px;
  left: 0;
  z-index: 1000;
  overflow: hidden;
}

.cbp-spmenu-horizontal h3 {
  height: 100%;
  width: 20%;
  float: left;
}

.cbp-spmenu-horizontal a {
  float: left;
  width: 20%;
  padding: 0.8em;
  border-left: 1px solid #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {
  left: -240px;
}

.cbp-spmenu-right {
  right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
  left: 0px;
}

.cbp-spmenu-right.cbp-spmenu-open {
  right: 0px;
}

/* Horizontal menu that slides from the top or bottom */

.cbp-spmenu-top {
  top: -150px;
}

.cbp-spmenu-bottom {
  bottom: -150px;
}

.cbp-spmenu-top.cbp-spmenu-open {
  top: 0px;
}

.cbp-spmenu-bottom.cbp-spmenu-open {
  bottom: 0px;
}

/* Push classes applied to the body */

.cbp-spmenu-push {
  overflow-x: hidden;
  position: relative;
  left: 0;
}

.cbp-spmenu-push-toright {
  left: 240px;
}

.cbp-spmenu-push-toleft {
  left: -240px;
}

/* Transitions */

.cbp-spmenu,
.cbp-spmenu-push {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* Example media queries */

@media screen and (max-width: 55.1875em){

  .cbp-spmenu-horizontal {
      font-size: 75%;
      height: 110px;
  }

  .cbp-spmenu-top {
      top: -110px;
  }

  .cbp-spmenu-bottom {
      bottom: -110px;
  }

}

@media screen and (max-height: 26.375em){

  .cbp-spmenu-vertical {
      font-size: 90%;
      width: 190px;
  }

  .cbp-spmenu-left,
  .cbp-spmenu-push-toleft {
      left: -190px;
  }

  .cbp-spmenu-right {
      right: -190px;
  }

  .cbp-spmenu-push-toright {
      left: 190px;
  }
}
  /* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
  font-family: 'fontawesome';
  src:url('../fonts/fontawesome.eot');
  src:url('../fonts/fontawesome.eot?#iefix') format('embedded-opentype'),
  url('http://asusgames.esy.es/CSS/fontawesome.svg#fontawesome') format('svg'),
      url('http://asusgames.esy.es/CSS/fontawesome.woff') format('woff'),
      url('http://asusgames.esy.es/CSS/fontawesome.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body, html { font-size: 100%;    padding: 0; margin: 0;}

/* Reset */
*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}
#lixo {
display:none;
}
body {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #0f354b;
    background: #273749 url("http://7-themes.com/data_images/out/7/6791475-free-christmas-wallpaper.jpg") top no-repeat;
}

a {
  color: #f0f0f0;
  text-decoration: none;
}


.main,
.container > header {
  width: 90%;
  max-width: 69em;
  margin: 0 auto;
  padding: 0 1.875em 3.125em 1.875em;
}

.container > header {
  padding: 2.875em 1.875em 1.875em;
}

.container > header h1 {
  font-size: 2.125em;
  line-height: 1.3;
  margin: 0;
  float: left;
  font-weight: 400;
}

.container > header span {
  display: block;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  padding: 0 0 0.6em 0.1em;
}

.container > header nav {
  float: right;
}

.container > header nav a {
  display: block;
  float: left;
  position: relative;
  width: 2.5em;
  height: 2.5em;
  background: #fff;
  border-radius: 50%;
  color: transparent;
  margin: 0 0.1em;
  border: 4px solid #0f354b;
  text-indent: -8000px;
}

.container > header nav a:after {
  content: attr(data-info);
  color: #0f354b;
  position: absolute;
  width: 600%;
  top: 120%;
  text-align: right;
  right: 0;
  opacity: 0;
  pointer-events: none;
}

.container > header nav a:hover:after {
  opacity: 1;
}

.container > header nav a:hover {
  background: #0f354b;
}

.main > section {
  max-width: 260px;
  width: 90%;
  margin: 0 auto;
}

.main > section h2 {
  font-weight: 300;
  color: #ccc;
}

.main > section button {
  border: none;
  background: #0f354b;
  color: #fff;
  padding: 1.5em;
  display: block;
  width: 100%;
  cursor: pointer;
  margin: 10px 0;
  font-size: 0.8em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button:hover {
  background: #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button.active {
  background: #0d77b6;
}

.main > section button.disabled {
  background: #aaa;
  pointer-events: none;
}

.icon-drop:before,
.icon-arrow-left:before {
  font-family: 'fontawesome';
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  speak: none;
  font-style: normal;
  font-weight: normal;
  line-height: 2;
  text-align: center;
  color: #0f354b;
  -webkit-font-smoothing: antialiased;
  text-indent: 8000px;
  padding-left: 8px;
}

.container > header nav a:hover:before {
  color: #fff;
}

.icon-drop:before {
  content: "\e000";
}

.icon-arrow-left:before {
  content: "\f060";
}
span.eddyeowna{
            background: #0f354b;
                                position:fixed;
            right:0px;
            bottom:30px;
            font-size:12px;
              -webkit-animation-name: bounceInDown;
                  animation-name: bounceInDown;
}
        span.eddyeowna a{
            color:#fff;
            text-transform:uppercase;
            text-decoration:none;
            margin-right:30px;
}
        span.eddyeowna a:hover{
            color:#000;
}
                  </style>
  <body class="cbp-spmenu-push">
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
        <h3>Fórum</h3>
                  <a href="/forum">Acessar</a>
                  <a href="/login">Logar</a>
                  <a href="/register">Registrar-se</a>
      </nav>
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2">
        <h3>Servidores</h3>
        <a href="samp://editavel">SA-MP</a>
   
      </nav>
      <div class="container">
        <header class="clearfix">
            <span class="animated BounceInUp">BEM-VINDO AO FÓRUM DO SERVIDOR TATU DM</span>
        </header>
        <div class="main">
            <section class="buttonset">
                                  <center><h2><span class="animated BounceInUp">ACESSO RÁPIDO</span></h2></center>
              <!-- Class "cbp-spmenu-open" gets applied to menu and "cbp-spmenu-push-toleft" or "cbp-spmenu-push-toright" to the body -->
              <button id="showLeftPush" class="animated bounceInUp">Fórum</button>
              <button id="showRightPush" class="animated bounceInDown">Servidores</button>
            </section>
        </div>
      </div>
            <span class="eddyeowna">
 
      <!-- Classie - class helper functions by @desandro https://github.com/desandro/classie -->
      <script src="http://asusgames.esy.es/CSS/classie.js"></script>
      <script>
        var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
            menuRight = document.getElementById( 'cbp-spmenu-s2' ),
            menuTop = document.getElementById( 'cbp-spmenu-s3' ),
            menuBottom = document.getElementById( 'cbp-spmenu-s4' ),
            showLeft = document.getElementById( 'showLeft' ),
            showRight = document.getElementById( 'showRight' ),
            showTop = document.getElementById( 'showTop' ),
            showBottom = document.getElementById( 'showBottom' ),
            showLeftPush = document.getElementById( 'showLeftPush' ),
            showRightPush = document.getElementById( 'showRightPush' ),
            body = document.body;
        showLeftPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toright' );
            classie.toggle( menuLeft, 'cbp-spmenu-open' );
            disableOther( 'showLeftPush' );
        };
        showRightPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toleft' );
            classie.toggle( menuRight, 'cbp-spmenu-open' );
            disableOther( 'showRightPush' );
        };

        function disableOther( button ) {
            if( button !== 'showLeft' ) {
              classie.toggle( showLeft, 'disabled' );
            }
            if( button !== 'showRight' ) {
              classie.toggle( showRight, 'disabled' );
            }
            if( button !== 'showTop' ) {
              classie.toggle( showTop, 'disabled' );
            }
            if( button !== 'showBottom' ) {
              classie.toggle( showBottom, 'disabled' );
            }
            if( button !== 'showLeftPush' ) {
              classie.toggle( showLeftPush, 'disabled' );
            }
            if( button !== 'showRightPush' ) {
              classie.toggle( showRightPush, 'disabled' );
            }
        }
      </script>

          <div id="lixo">
      <a href="http://www.forumeiros.com" target="_blank">forumeiros.com</a>
      </div>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script language=JavaScript>
<!--
var mensagem="";
function clickIE() {if (document.all) {(mensagem);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(mensagem);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
  <script language="JavaScript">
    function protegercodigo() {
    if (event.button==2||event.button==3){
    }
    document.onmousedown=protegercodigo
</script>
  </body>
</html>

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/

Resolvido Re: Página inicial para servidor de SA-MP

Mensagem por PrisoN†BreaK em 02/12/15, 11:54 am

@IsmaelS. escreveu:Boa noite!

Assim amigo?
Código:


<!DOCTYPE html>
<html lang="en" class="no-js">
  <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Editavel</title>
      <meta name="description" content="Editavel" />
      <meta name="keywords" content="SA:MP - RPG" />
      <meta name="author" content="Codrops" />
      <link rel="shortcut icon" href="http://asusgames.esy.es/cloud.ico">
                <link rel="stylesheet" href="http://asusgames.esy.es/MyCSS.css" type="text/css" media="screen"/>
      <script src="http://asusgames.esy.es/CSS/modernizr.custom.js"></script>
  </head>
<style>
  /* General styles for all menus */
.cbp-spmenu {
  background: #163c52;
  position: fixed;
}

.cbp-spmenu h3 {
  color: #afdefa;
  font-size: 1.9em;
  padding: 20px;
  margin: 0;
  font-weight: 300;
  background: #0d77b6;
}

.cbp-spmenu a {
  display: block;
  color: #fff;
  font-size: 1.1em;
  font-weight: 300;
}

.cbp-spmenu a:hover {
  background: #1c5f85;
}

.cbp-spmenu a:active {
  background: #afdefa;
  color: #0f354b;
}

/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {
  width: 240px;
  height: 100%;
  top: 0;
  z-index: 1000;
}

.cbp-spmenu-vertical a {
  border-bottom: 1px solid #1c5f85;
  padding: 1em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.cbp-spmenu-horizontal {
  width: 100%;
  height: 150px;
  left: 0;
  z-index: 1000;
  overflow: hidden;
}

.cbp-spmenu-horizontal h3 {
  height: 100%;
  width: 20%;
  float: left;
}

.cbp-spmenu-horizontal a {
  float: left;
  width: 20%;
  padding: 0.8em;
  border-left: 1px solid #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {
  left: -240px;
}

.cbp-spmenu-right {
  right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
  left: 0px;
}

.cbp-spmenu-right.cbp-spmenu-open {
  right: 0px;
}

/* Horizontal menu that slides from the top or bottom */

.cbp-spmenu-top {
  top: -150px;
}

.cbp-spmenu-bottom {
  bottom: -150px;
}

.cbp-spmenu-top.cbp-spmenu-open {
  top: 0px;
}

.cbp-spmenu-bottom.cbp-spmenu-open {
  bottom: 0px;
}

/* Push classes applied to the body */

.cbp-spmenu-push {
  overflow-x: hidden;
  position: relative;
  left: 0;
}

.cbp-spmenu-push-toright {
  left: 240px;
}

.cbp-spmenu-push-toleft {
  left: -240px;
}

/* Transitions */

.cbp-spmenu,
.cbp-spmenu-push {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* Example media queries */

@media screen and (max-width: 55.1875em){

  .cbp-spmenu-horizontal {
      font-size: 75%;
      height: 110px;
  }

  .cbp-spmenu-top {
      top: -110px;
  }

  .cbp-spmenu-bottom {
      bottom: -110px;
  }

}

@media screen and (max-height: 26.375em){

  .cbp-spmenu-vertical {
      font-size: 90%;
      width: 190px;
  }

  .cbp-spmenu-left,
  .cbp-spmenu-push-toleft {
      left: -190px;
  }

  .cbp-spmenu-right {
      right: -190px;
  }

  .cbp-spmenu-push-toright {
      left: 190px;
  }
}
  /* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
  font-family: 'fontawesome';
  src:url('../fonts/fontawesome.eot');
  src:url('../fonts/fontawesome.eot?#iefix') format('embedded-opentype'),
  url('http://asusgames.esy.es/CSS/fontawesome.svg#fontawesome') format('svg'),
      url('http://asusgames.esy.es/CSS/fontawesome.woff') format('woff'),
      url('http://asusgames.esy.es/CSS/fontawesome.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body, html { font-size: 100%;    padding: 0; margin: 0;}

/* Reset */
*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}
#lixo {
display:none;
}
body {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #0f354b;
    background: #273749 url("http://7-themes.com/data_images/out/7/6791475-free-christmas-wallpaper.jpg") top no-repeat;
}

a {
  color: #f0f0f0;
  text-decoration: none;
}


.main,
.container > header {
  width: 90%;
  max-width: 69em;
  margin: 0 auto;
  padding: 0 1.875em 3.125em 1.875em;
}

.container > header {
  padding: 2.875em 1.875em 1.875em;
}

.container > header h1 {
  font-size: 2.125em;
  line-height: 1.3;
  margin: 0;
  float: left;
  font-weight: 400;
}

.container > header span {
  display: block;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  padding: 0 0 0.6em 0.1em;
}

.container > header nav {
  float: right;
}

.container > header nav a {
  display: block;
  float: left;
  position: relative;
  width: 2.5em;
  height: 2.5em;
  background: #fff;
  border-radius: 50%;
  color: transparent;
  margin: 0 0.1em;
  border: 4px solid #0f354b;
  text-indent: -8000px;
}

.container > header nav a:after {
  content: attr(data-info);
  color: #0f354b;
  position: absolute;
  width: 600%;
  top: 120%;
  text-align: right;
  right: 0;
  opacity: 0;
  pointer-events: none;
}

.container > header nav a:hover:after {
  opacity: 1;
}

.container > header nav a:hover {
  background: #0f354b;
}

.main > section {
  max-width: 260px;
  width: 90%;
  margin: 0 auto;
}

.main > section h2 {
  font-weight: 300;
  color: #ccc;
}

.main > section button {
  border: none;
  background: #0f354b;
  color: #fff;
  padding: 1.5em;
  display: block;
  width: 100%;
  cursor: pointer;
  margin: 10px 0;
  font-size: 0.8em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button:hover {
  background: #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button.active {
  background: #0d77b6;
}

.main > section button.disabled {
  background: #aaa;
  pointer-events: none;
}

.icon-drop:before,
.icon-arrow-left:before {
  font-family: 'fontawesome';
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  speak: none;
  font-style: normal;
  font-weight: normal;
  line-height: 2;
  text-align: center;
  color: #0f354b;
  -webkit-font-smoothing: antialiased;
  text-indent: 8000px;
  padding-left: 8px;
}

.container > header nav a:hover:before {
  color: #fff;
}

.icon-drop:before {
  content: "\e000";
}

.icon-arrow-left:before {
  content: "\f060";
}
span.eddyeowna{
            background: #0f354b;
                                position:fixed;
            right:0px;
            bottom:30px;
            font-size:12px;
              -webkit-animation-name: bounceInDown;
                  animation-name: bounceInDown;
}
        span.eddyeowna a{
            color:#fff;
            text-transform:uppercase;
            text-decoration:none;
            margin-right:30px;
}
        span.eddyeowna a:hover{
            color:#000;
}
                  </style>
  <body class="cbp-spmenu-push">
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
        <h3>Fórum</h3>
                  <a href="/forum">Acessar</a>
                  <a href="/login">Logar</a>
                  <a href="/register">Registrar-se</a>
      </nav>
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2">
        <h3>Servidores</h3>
        <a href="samp://editavel">SA-MP</a>
    
      </nav>
      <div class="container">
        <header class="clearfix">
            <span class="animated BounceInUp">BEM-VINDO AO FÓRUM DO SERVIDOR TATU DM</span>
        </header>
        <div class="main">
            <section class="buttonset">
                                  <center><h2><span class="animated BounceInUp">ACESSO RÁPIDO</span></h2></center>
              <!-- Class "cbp-spmenu-open" gets applied to menu and "cbp-spmenu-push-toleft" or "cbp-spmenu-push-toright" to the body -->
              <button id="showLeftPush" class="animated bounceInUp">Fórum</button>
              <button id="showRightPush" class="animated bounceInDown">Servidores</button>
            </section>
        </div>
      </div>
            <span class="eddyeowna">
  
      <!-- Classie - class helper functions by @desandro https://github.com/desandro/classie -->
      <script src="http://asusgames.esy.es/CSS/classie.js"></script>
      <script>
        var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
            menuRight = document.getElementById( 'cbp-spmenu-s2' ),
            menuTop = document.getElementById( 'cbp-spmenu-s3' ),
            menuBottom = document.getElementById( 'cbp-spmenu-s4' ),
            showLeft = document.getElementById( 'showLeft' ),
            showRight = document.getElementById( 'showRight' ),
            showTop = document.getElementById( 'showTop' ),
            showBottom = document.getElementById( 'showBottom' ),
            showLeftPush = document.getElementById( 'showLeftPush' ),
            showRightPush = document.getElementById( 'showRightPush' ),
            body = document.body;
        showLeftPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toright' );
            classie.toggle( menuLeft, 'cbp-spmenu-open' );
            disableOther( 'showLeftPush' );
        };
        showRightPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toleft' );
            classie.toggle( menuRight, 'cbp-spmenu-open' );
            disableOther( 'showRightPush' );
        };

        function disableOther( button ) {
            if( button !== 'showLeft' ) {
              classie.toggle( showLeft, 'disabled' );
            }
            if( button !== 'showRight' ) {
              classie.toggle( showRight, 'disabled' );
            }
            if( button !== 'showTop' ) {
              classie.toggle( showTop, 'disabled' );
            }
            if( button !== 'showBottom' ) {
              classie.toggle( showBottom, 'disabled' );
            }
            if( button !== 'showLeftPush' ) {
              classie.toggle( showLeftPush, 'disabled' );
            }
            if( button !== 'showRightPush' ) {
              classie.toggle( showRightPush, 'disabled' );
            }
        }
      </script>

          <div id="lixo">
      <a href="http://www.forumeiros.com" target="_blank">forumeiros.com</a>
      </div>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script language=JavaScript>
<!--
var mensagem="";
function clickIE() {if (document.all) {(mensagem);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(mensagem);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
  <script language="JavaScript">
    function protegercodigo() {
    if (event.button==2||event.button==3){
    }
    document.onmousedown=protegercodigo
</script>
  </body>
</html>
Sim exatamente assim, mais eu gostaria com outra imagem, outros botões, caindo flocos de neve, e tocando uma musica natalina, tem como? Vi isso em outro fórum no ano passado, mais eles já tiraram.
avatar

PrisoN†BreaK
Membro do Fórum

Masculino
Inscrito dia : 23/10/2015
Mensagens : 1100
Pontos Ativos : 1550

http://brasilplayfreedomofc.forumeiros.com/forum

Resolvido Re: Página inicial para servidor de SA-MP

Mensagem por IsmaelS. em 02/12/15, 04:14 pm

Boa tarde!

Tentei algo:
Código:
<!DOCTYPE html>
<html lang="en" class="no-js">
  <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Editavel</title>
      <meta name="description" content="Editavel" />
      <meta name="keywords" content="SA:MP - RPG" />
      <meta name="author" content="Codrops" />
      <link rel="shortcut icon" href="http://asusgames.esy.es/cloud.ico">
                <link rel="stylesheet" href="http://asusgames.esy.es/MyCSS.css" type="text/css" media="screen"/>
      <script src="http://asusgames.esy.es/CSS/modernizr.custom.js"></script>
  </head>
<style>
  /* General styles for all menus */
.cbp-spmenu {
  background: #7E3830;
  position: fixed;
}

.cbp-spmenu h3 {
    color: #FFFFFF;
    font-size: 1.9em;
    padding: 20px;
    margin: 0;
    font-weight: 300;
    background: rgba(212, 53, 21, 0.55);
}
 
.cbp-spmenu a {
  display: block;
  color: #fff;
  font-size: 1.1em;
  font-weight: 300;
}

.cbp-spmenu a:hover {
  background: #1c5f85;
}

.cbp-spmenu a:active {
  background: #afdefa;
  color: #0f354b;
}

/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {
  width: 240px;
  height: 100%;
  top: 0;
  z-index: 1000;
}

.cbp-spmenu-vertical a {
  border-bottom: 1px solid rgb(255, 255, 255);
  padding: 1em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.cbp-spmenu-horizontal {
  width: 100%;
  height: 150px;
  left: 0;
  z-index: 1000;
  overflow: hidden;
}

.cbp-spmenu-horizontal h3 {
  height: 100%;
  width: 20%;
  float: left;
}

.cbp-spmenu-horizontal a {
  float: left;
  width: 20%;
  padding: 0.8em;
  border-left: 1px solid #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {
  left: -240px;
}

.cbp-spmenu-right {
  right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
  left: 0px;
}

.cbp-spmenu-right.cbp-spmenu-open {
  right: 0px;
}

/* Horizontal menu that slides from the top or bottom */

.cbp-spmenu-top {
  top: -150px;
}

.cbp-spmenu-bottom {
  bottom: -150px;
}

.cbp-spmenu-top.cbp-spmenu-open {
  top: 0px;
}

.cbp-spmenu-bottom.cbp-spmenu-open {
  bottom: 0px;
}

/* Push classes applied to the body */

.cbp-spmenu-push {
  overflow-x: hidden;
  position: relative;
  left: 0;
}

.cbp-spmenu-push-toright {
  left: 240px;
}

.cbp-spmenu-push-toleft {
  left: -240px;
}

/* Transitions */

.cbp-spmenu,
.cbp-spmenu-push {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* Example media queries */

@media screen and (max-width: 55.1875em){

  .cbp-spmenu-horizontal {
      font-size: 75%;
      height: 110px;
  }

  .cbp-spmenu-top {
      top: -110px;
  }

  .cbp-spmenu-bottom {
      bottom: -110px;
  }

}

@media screen and (max-height: 26.375em){

  .cbp-spmenu-vertical {
      font-size: 90%;
      width: 190px;
  }

  .cbp-spmenu-left,
  .cbp-spmenu-push-toleft {
      left: -190px;
  }

  .cbp-spmenu-right {
      right: -190px;
  }

  .cbp-spmenu-push-toright {
      left: 190px;
  }
}
  /* General Demo Style */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
  font-family: 'fontawesome';
  src:url('../fonts/fontawesome.eot');
  src:url('../fonts/fontawesome.eot?#iefix') format('embedded-opentype'),
  url('http://asusgames.esy.es/CSS/fontawesome.svg#fontawesome') format('svg'),
      url('http://asusgames.esy.es/CSS/fontawesome.woff') format('woff'),
      url('http://asusgames.esy.es/CSS/fontawesome.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body, html { font-size: 100%;    padding: 0; margin: 0;}

/* Reset */
*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}
#lixo {
display:none;
}
body {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #0f354b;
    background: #273749 url("http://www.hdwallpaperscool.com/wp-content/uploads/2013/12/animated-christmas-hd-wallpapers-cool-desktop-images-widescreen.jpg") top no-repeat;
}

a {
  color: #f0f0f0;
  text-decoration: none;
}


.main,
.container > header {
  width: 90%;
    max-width: 47em;
    margin: 61px auto;
    padding: 0 1.875em 6.125em 3.875em;
}
.container > header {
  padding: 2.875em 1.875em 1.875em;
}

.container > header h1 {
  font-size: 2.125em;
  line-height: 1.3;
  margin: 0;
  float: left;
  font-weight: 400;
}

.container > header span {
  display: block;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  padding: 0 0 0.6em 0.1em;
}

.container > header nav {
  float: right;
}

.container > header nav a {
  display: block;
  float: left;
  position: relative;
  width: 2.5em;
  height: 2.5em;
  background: #fff;
  border-radius: 50%;
  color: transparent;
  margin: 0 0.1em;
  border: 4px solid #0f354b;
  text-indent: -8000px;
}

.container > header nav a:after {
  content: attr(data-info);
  color: #0f354b;
  position: absolute;
  width: 600%;
  top: 120%;
  text-align: right;
  right: 0;
  opacity: 0;
  pointer-events: none;
}

.container > header nav a:hover:after {
  opacity: 1;
}

.container > header nav a:hover {
  background: #0f354b;
}

.main > section {
  max-width: 260px;
  width: 90%;
  margin: 0 auto;
}

.main > section h2 {
  color: #ccc;
}

.main > section button {
  border: none;
  background: #7E3830;
  color: #fff;
  padding: 1.5em;
  display: block;
  width: 100%;
  cursor: pointer;
  margin: 10px 0;
  font-size: 0.8em;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button:hover {
  background: #1c5f85;
    -webkit-transition:background 0.5s ease-out;
      -moz-transition:background 0.5s ease-out;
      -o-transition:background 0.5s ease-out;
      -ms-transition:background 0.5s ease-out;
}

.main > section button.active {
  background: #0d77b6;
}

.main > section button.disabled {
  background: #aaa;
  pointer-events: none;
}

.icon-drop:before,
.icon-arrow-left:before {
  font-family: 'fontawesome';
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  speak: none;
  font-style: normal;
  font-weight: normal;
  line-height: 2;
  text-align: center;
  color: #0f354b;
  -webkit-font-smoothing: antialiased;
  text-indent: 8000px;
  padding-left: 8px;
}

.container > header nav a:hover:before {
  color: #fff;
}

.icon-drop:before {
  content: "\e000";
}

.icon-arrow-left:before {
  content: "\f060";
}
span.eddyeowna{
            background: #0f354b;
                                position:fixed;
            right:0px;
            bottom:30px;
            font-size:12px;
              -webkit-animation-name: bounceInDown;
                  animation-name: bounceInDown;
}
        span.eddyeowna a{
            color:#fff;
            text-transform:uppercase;
            text-decoration:none;
            margin-right:30px;
}
        span.eddyeowna a:hover{
            color:#000;
}
                  </style>
  <body class="cbp-spmenu-push">
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
        <h3>Fórum</h3>
                  <a href="/forum">Acessar</a>
                  <a href="/login">Logar</a>
                  <a href="/register">Registrar-se</a>
      </nav>
      <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2">
        <h3>Servidores</h3>
        <a href="samp://editavel">SA-MP</a>
   
      </nav>
      <div class="container">
        <header class="clearfix">
            <span><span style="color: #FF2020;">BEM-VINDO AO FÓRUM DO SERVIDOR TATU DM</span></span>
        </header>
        <div class="main">
            <section class="buttonset">
                                  <center><h2><span class=""><span style="color: #FF2020;">ACESSO RÁPIDO</span></span></h2></center>
              <!-- Class "cbp-spmenu-open" gets applied to menu and "cbp-spmenu-push-toleft" or "cbp-spmenu-push-toright" to the body -->
              <button id="showLeftPush" class="animated bounceInUp">Fórum</button>
              <button id="showRightPush" class="animated bounceInDown">Servidores</button>
            </section>
        </div>
      </div>
            <span class="eddyeowna">
 
      <!-- Classie - class helper functions by @desandro https://github.com/desandro/classie -->
      <script src="http://asusgames.esy.es/CSS/classie.js"></script>
      <script>

       
        var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
            menuRight = document.getElementById( 'cbp-spmenu-s2' ),
            menuTop = document.getElementById( 'cbp-spmenu-s3' ),
            menuBottom = document.getElementById( 'cbp-spmenu-s4' ),
            showLeft = document.getElementById( 'showLeft' ),
            showRight = document.getElementById( 'showRight' ),
            showTop = document.getElementById( 'showTop' ),
            showBottom = document.getElementById( 'showBottom' ),
            showLeftPush = document.getElementById( 'showLeftPush' ),
            showRightPush = document.getElementById( 'showRightPush' ),
            body = document.body;
        showLeftPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toright' );
            classie.toggle( menuLeft, 'cbp-spmenu-open' );
            disableOther( 'showLeftPush' );
        };
        showRightPush.onclick = function() {
            classie.toggle( this, 'active' );
            classie.toggle( body, 'cbp-spmenu-push-toleft' );
            classie.toggle( menuRight, 'cbp-spmenu-open' );
            disableOther( 'showRightPush' );
        };

        function disableOther( button ) {
            if( button !== 'showLeft' ) {
              classie.toggle( showLeft, 'disabled' );
            }
            if( button !== 'showRight' ) {
              classie.toggle( showRight, 'disabled' );
            }
            if( button !== 'showTop' ) {
              classie.toggle( showTop, 'disabled' );
            }
            if( button !== 'showBottom' ) {
              classie.toggle( showBottom, 'disabled' );
            }
            if( button !== 'showLeftPush' ) {
              classie.toggle( showLeftPush, 'disabled' );
            }
            if( button !== 'showRightPush' ) {
              classie.toggle( showRightPush, 'disabled' );
            }
        }
      </script>

          <div id="lixo">
      <a href="http://www.forumeiros.com" target="_blank">forumeiros.com</a>
      </div>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script language=JavaScript>
<!--
var mensagem="";
function clickIE() {if (document.all) {(mensagem);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(mensagem);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
  <script language="JavaScript">
    function protegercodigo() {
    if (event.button==2||event.button==3){
    }
    document.onmousedown=protegercodigo
</script>
  </body>
</html>

Caso prefira outro fundo de imagem apenas encontre este link (http://www.hdwallpaperscool.com/wp-content/uploads/2013/12/animated-christmas-hd-wallpapers-cool-desktop-images-widescreen.jpg) e altere para a que desejar, enquanto aos flocos de neve não consegui tal.

IsmaelS.
Usuário experiente

Masculino
Inscrito dia : 24/11/2012
Mensagens : 2768
Pontos Ativos : 3863

http://master-publicitario.forumeiros.com/

Resolvido Re: Página inicial para servidor de SA-MP

Mensagem por PrisoN†BreaK em 03/12/15, 10:53 am

Ok, mesmo assim obrigado pela ajuda, pode marca o tópico como resolvido e fecha-lo.
avatar

PrisoN†BreaK
Membro do Fórum

Masculino
Inscrito dia : 23/10/2015
Mensagens : 1100
Pontos Ativos : 1550

http://brasilplayfreedomofc.forumeiros.com/forum

Resolvido Re: Página inicial para servidor de SA-MP

Mensagem por MateusAnjosV em 06/12/15, 01:56 pm

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1421
Pontos Ativos : 1987

http://ajuda.forumeiros.com/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

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