Colocar banners móveis no cabeçalho do fórum

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

Atendido / Resolvido Colocar banners móveis no cabeçalho do fórum

Mensagem por BichodoMato em 30.01.17 15:09

Detalhes da questão


Endereço do fórum: http://naruto-survival.forumeiros.com/
Versão do fórum: PhpBB2

Descrição


Olá, gostaria de saber como faço para colocar um passador de slides automático no cabeçalho do fórum, desses que você encontra em outros fóruns com banners e informativos passando no topo para orientar o usuário.

Deixo um exemplo para ficar mais nítido como espero ficar os banners e onde devem ficar:

Como está agora:
Colocar banners móveis no cabeçalho do fórum 2i1yww4

Como espero que fique:
Colocar banners móveis no cabeçalho do fórum 14l7j1e

As imagens para os slides são apenas essas duas que deixarei aqui em baixo:

Slides:
Colocar banners móveis no cabeçalho do fórum T7il8l
Colocar banners móveis no cabeçalho do fórum 25kpuva

Lembrando que essas imagens precisam ter links, agradeceria se deixassem um espaço para que eu mesmo os coloque. Obrigado! ^^



BichodoMato

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 07/07/2013
Mensagens : 389
Pontos Ativos : 643

Ver perfil do usuário http://naruto-survival.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por Kyo Panda em 31.01.17 15:04

Você poderia tentar seguir esse tutorial, mas aplicando o código em Painel de controle Flecha ajudeiros Visualização Flecha ajudeiros Página inicial Flecha ajudeiros Geral, no campo Mensagem na página inicial.

o/
Kyo Panda

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4641
Pontos Ativos : 5934

Ver perfil do usuário https://ajuda.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por BichodoMato em 01.02.17 10:46

Olá Kyo, segui os procedimentos que me pediu mas nada aconteceu...

Segue o código que coloquei na "Mensagem da Página Inicial":

Código:
          <script src="http://steeph.vilabol.uol.com.br/slidedenovidades/slide3_script1.js" type="text/javascript"></script>        <script src="http://steeph.vilabol.uol.com.br/slidedenovidades/slide3_script2.js" type="text/javascript"></script>          <script>
        var simpleGallery_navpanel={
            panel: {height:'45px', opacity:0.5, paddingTop:'5px', fontStyle:'bold 11px Verdana'}, //customize nav panel container
            images: [    'http://img801.imageshack.us/img801/833/left.gif', 'http://img185.imageshack.us/img185/4655/playf.gif', 'http://img824.imageshack.us/img824/9263/right.gif', 'http://img291.imageshack.us/img291/3786/paused.gif'    ], //nav panel images (in that order)
            imageSpacing: {offsetTop:[-4, 0, -4], spacing:10}, //top offset of left, play, and right images, PLUS spacing between the 3 images
            slideduration: 500 //duration of slide up animation to reveal panel
        }
        </script>          <script type="text/javascript">
 
        var mygallery=new simpleGallery({
            wrapperid: "simplegallery1", //ID of main gallery container,
            dimensions: [500, 220], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
            imagearray: [
                ["http://i68.tinypic.com/t7il8l.png", "http://naruto-survival.forumeiros.com/]", "_new", "Nova Akatsuki"], ["http://i68.tinypic.com/25kpuva.png", "http://naruto-survival.forumeiros.com/]", "_new", "Novo Mapa"]
           
            ],
            autoplay: [true, 2500, 50], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]
            persist: false, //remember last viewed slide and recall within same session?
            fadeduration: 500, //transition duration (milliseconds)
            oninit:function(){ //event that fires when gallery has initialized/ ready to run
                //Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))
            },
            onslide:function(curslide, i){ //event that fires after each slide is shown
                //Keyword "this": references current gallery instance
                //curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
                //i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
            }
        })
 
        </script>
<div style="z-index:1;" id="simplegallery1" class="slideshowborda">
          
</div>
     
BichodoMato

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 07/07/2013
Mensagens : 389
Pontos Ativos : 643

Ver perfil do usuário http://naruto-survival.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por Kyo Panda em 02.02.17 1:13

Eu analisei o código do tutorial e parece que ele já não funciona como esperado. Tente esse:

Código:
<script src="https://cdnjs.cloudflare.com/ajax/libs/unslider/2.0.3/js/unslider-min.js" /></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/unslider/2.0.3/css/unslider.css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/unslider/2.0.3/css/unslider-dots.css" rel="stylesheet" />
<div class="fa-slider">
   <ul>
      <li>
         <img src="http://i68.tinypic.com/t7il8l.png" />
      </li>
      <li>
         <img src="http://i68.tinypic.com/25kpuva.png" />
      </li>
   </ul>
</div>
<script>jQuery('.fa-slider').unslider();</script>

A aplicação continua sendo na descrição.
Kyo Panda

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4641
Pontos Ativos : 5934

Ver perfil do usuário https://ajuda.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por BichodoMato em 03.02.17 13:40

Na realidade até funcionou, mas parcialmente. Tem algumas coisas meio fora de escalas... A passagem não é automática tbm. Se possivel tem como colocar as duas imagens no mesmo tamanho pelo código?
BichodoMato

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 07/07/2013
Mensagens : 389
Pontos Ativos : 643

Ver perfil do usuário http://naruto-survival.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por Kyo Panda em 03.02.17 19:07

Troque por esse:

Código:
<script src="https://cdnjs.cloudflare.com/ajax/libs/unslider/2.0.3/js/unslider-min.js" /></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/unslider/2.0.3/css/unslider.css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/unslider/2.0.3/css/unslider-dots.css" rel="stylesheet" />
<div class="fa-slider">
  <ul>
      <li>
        <img src="http://i68.tinypic.com/t7il8l.png" />
      </li>
      <li>
        <img src="http://i68.tinypic.com/25kpuva.png" />
      </li>
  </ul>
</div>
<script>jQuery('.fa-slider').unslider({autoplay: true});</script>

E adicione ao CSS:

Código:
.fa-slider img {
  width: 100%;
  height: auto;
}
Kyo Panda

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4641
Pontos Ativos : 5934

Ver perfil do usuário https://ajuda.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por BichodoMato em 04.02.17 22:05

Quase lá, se puder dar uma olhada no forum, ficou um espaço em branco que empurra o slide pro lado
BichodoMato

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 07/07/2013
Mensagens : 389
Pontos Ativos : 643

Ver perfil do usuário http://naruto-survival.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por Kyo Panda em 05.02.17 0:56

Adicione mais essa peça ao CSS:

Código:
.unslider-wrap {
    padding-left: 0 !important;
}

o7
Kyo Panda

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4641
Pontos Ativos : 5934

Ver perfil do usuário https://ajuda.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por BichodoMato em 05.02.17 1:03

Perfeito! Obrigado de novo Kyo!
BichodoMato

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 07/07/2013
Mensagens : 389
Pontos Ativos : 643

Ver perfil do usuário http://naruto-survival.forumeiros.com

Atendido / Resolvido Re: Colocar banners móveis no cabeçalho do fórum

Mensagem por Kyo Panda em 05.02.17 1:06

Às ordens. o/

---
Colocar banners móveis no cabeçalho do fórum Symbol10 Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

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

Kyo Panda
Super usuário

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4641
Pontos Ativos : 5934

Ver perfil do usuário https://ajuda.forumeiros.com

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


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