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
Login

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Os membros mais ativos da semana
Kyo Panda
 
Shek Crowley
 
Fou-Lu
 
Holkis
 
iScroll
 
Sr.Oliveira
 
while
 
Harleen
 
fiapinho
 
Stewart
 

Quem está conectado
223 usuários online :: 3 usuários cadastrados, Nenhum Invisível e 220 Visitantes :: 2 Motores de busca

DooGy00, ranzatti, tabarra

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

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 Ter 1 Dez 2015 - 14:38

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?

PrisoN†BreaK
Membro do Fórum

Masculino
Inscrito dia : 23/10/2015
Mensagens : 1033
Pontos Ativos : 1943

http://brasilplayfreedomofc.forumeiros.com/forum

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

Mensagem por Hancki em Ter 1 Dez 2015 - 19:53

Olá!

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

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

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 Ter 1 Dez 2015 - 19:57

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 : 2610
Pontos Ativos : 5174

http://suportedesign.forumeiros.com/

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

Mensagem por PrisoN†BreaK em Qua 2 Dez 2015 - 13:54

@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.

PrisoN†BreaK
Membro do Fórum

Masculino
Inscrito dia : 23/10/2015
Mensagens : 1033
Pontos Ativos : 1943

http://brasilplayfreedomofc.forumeiros.com/forum

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

Mensagem por IsmaelS. em Qua 2 Dez 2015 - 18:14

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 : 2610
Pontos Ativos : 5174

http://suportedesign.forumeiros.com/

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

Mensagem por PrisoN†BreaK em Qui 3 Dez 2015 - 12:53

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

PrisoN†BreaK
Membro do Fórum

Masculino
Inscrito dia : 23/10/2015
Mensagens : 1033
Pontos Ativos : 1943

http://brasilplayfreedomofc.forumeiros.com/forum

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

Mensagem por MateusAnjosV em Dom 6 Dez 2015 - 15:56

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

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

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1417
Pontos Ativos : 2476

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