Codigo de slide

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

Resolvido Codigo de slide

Mensagem por Keep em 10/04/12, 03:16 pm

Qual é minha questão:
http://m2.ongame.com.br/home.php

Medidas que eu tomei para corrigir o problema:
-

Links e imagens do meu problema:
http://i.imgur.com/gU5LC.png

Endereço do meu fórum:
http://metin2-br.forumeiros.com/

Versão do meu fórum:
PHPBB3
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Troubleshoot em 10/04/12, 03:24 pm

Olá, primeiramente adicione este código em sua 'Folha CSS'
Código:
#box_banner_rotativo_eventos {
    border: 1px solid #643131;
    height: 200px !important;
    padding:0px;
    position: absolute;
    top:207px;
    width:200px;
    left:0px;
}
#box_banner_rotativo_eventos #controlador{
    border: 0px solid red;
    margin: 180px 0 0 0px;
    position: absolute;
    z-index: 1;
    width: 200px;
    text-align: center;
}


Depois adicione este em um widget ou na Home Page

Código:
<div id="box_banner_rotativo_eventos">
<script language="javascript" type="text/javascript" src="http://m2.ongame.com.br/js/jquery.flow.1.2.auto.js"></script><script language="javascript" type="text/javascript">
                            $(document).ready(function(){
                                $("#controlador").jFlow({
                                    slides: "#banners",
                                    controller: ".jFlowControl", // must be class, use . sign
                                    slideWrapper : "#jFlowSlide", // must be id, use # sign
                                    selectedWrapper: "jFlowSelected",  // just pure text, no sign
                                    auto: true,    //auto change slide, default true
                                    easing: "swing",
                                    duration: 700,
                                    prev: ".jFlowPrev", // must be class, use . sign
                                    next: ".jFlowNext" // must be class, use . sign
                                });
                            });
                            </script><div id="controlador"><span class="jFlowControl jFlowSelected">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/1_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/2_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/3_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/4_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/5_ico.gif" alt="" title="">
                                    </span></div><div id="jFlowSlide" style="position: relative; width: 100%; overflow-x: hidden; overflow-y: hidden; "><div id="banners" style="position: relative; width: 1000px; height: 200px; overflow-x: hidden; overflow-y: hidden; margin-left: -164.52296117115054px; "><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7506/pascoa-premiada-ongame"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner-metin-pascoa.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7366/ta-chovendo-metin-brotando-jazida "><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner_ta_chovendo_metin.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7514/evento-ss-do-mes-abril"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/ss_mes.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7507/36-eleicao-para-imperador/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/metin_36_eleicao.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/6216/segredo-do-treinador-de-recrutas/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/m2_treinador_recrutas.jpg" alt="" title=""></a>
                                    </div></div></div></div><span class="jFlowPrev"></span><span class="jFlowNext"></span></div>

Caso venha a ficar ''Bugado'' adicione apenas este código em um 'Widget' ou na 'Home Page' :

Código:

<script language="javascript" type="text/javascript" src="http://m2.ongame.com.br/js/jquery.flow.1.2.auto.js"></script><script language="javascript" type="text/javascript">
                            $(document).ready(function(){
                                $("#controlador").jFlow({
                                    slides: "#banners",
                                    controller: ".jFlowControl", // must be class, use . sign
                                    slideWrapper : "#jFlowSlide", // must be id, use # sign
                                    selectedWrapper: "jFlowSelected",  // just pure text, no sign
                                    auto: true,    //auto change slide, default true
                                    easing: "swing",
                                    duration: 700,
                                    prev: ".jFlowPrev", // must be class, use . sign
                                    next: ".jFlowNext" // must be class, use . sign
                                });
                            });
                            </script><div id="controlador"><span class="jFlowControl jFlowSelected">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/1_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/2_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/3_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/4_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/5_ico.gif" alt="" title="">
                                    </span></div><div id="jFlowSlide" style="position: relative; width: 100%; overflow-x: hidden; overflow-y: hidden; "><div id="banners" style="position: relative; width: 1000px; height: 200px; overflow-x: hidden; overflow-y: hidden; margin-left: -164.52296117115054px; "><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7506/pascoa-premiada-ongame"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner-metin-pascoa.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7366/ta-chovendo-metin-brotando-jazida "><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner_ta_chovendo_metin.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7514/evento-ss-do-mes-abril"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/ss_mes.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7507/36-eleicao-para-imperador/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/metin_36_eleicao.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/6216/segredo-do-treinador-de-recrutas/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/m2_treinador_recrutas.jpg" alt="" title=""></a>
                                    </div></div></div></div><span class="jFlowPrev"></span><span class="jFlowNext"></span>

Resulta?

Até.
avatar

Troubleshoot
Usuário experiente

Masculino
Inscrito dia : 25/09/2011
Mensagens : 2193
Pontos Ativos : 2934

Ver perfil do usuário http://guiatecnico.ativo-forum.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 10/04/12, 03:45 pm

olá não resultou o primeiro não apareceu e o segundo codigo ficou bugado como na imagem abaixo
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Troubleshoot em 10/04/12, 03:55 pm

Poderia deixar o código ativado ?
OBs : Teste os dois códigos que te passei .
avatar

Troubleshoot
Usuário experiente

Masculino
Inscrito dia : 25/09/2011
Mensagens : 2193
Pontos Ativos : 2934

Ver perfil do usuário http://guiatecnico.ativo-forum.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 10/04/12, 04:14 pm

PODE OLHAR LÁ... o slide 1 q é o 2 segundo codigo esta no lugar certo mais está bugado o slider2 está na parte superior do forum e também bugado...

OBS> slider 1 e 2 os nomes do widgets que coloquei...
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Troubleshoot em 10/04/12, 04:25 pm

Tente adicionar este código :

Folha CSS:
Código:
#controlador{
    border: 0px solid red;
    margin: 180px 0 0 0px;
    position: absolute;
    z-index: 1;
    width: 200px;
    text-align: center;
}
#banners{
    width:200px;
    height:200px;
}
.jFlowSlideContainer {
width: 200px;
height: 200px;
}

Em um widget ou na Home Page:

Código:
<script language="javascript" type="text/javascript" src="http://m2.ongame.com.br/js/jquery.flow.1.2.auto.js"></script><script language="javascript" type="text/javascript">
                            $(document).ready(function(){
                                $("#controlador").jFlow({
                                    slides: "#banners",
                                    controller: ".jFlowControl", // must be class, use . sign
                                    slideWrapper : "#jFlowSlide", // must be id, use # sign
                                    selectedWrapper: "jFlowSelected",  // just pure text, no sign
                                    auto: true,    //auto change slide, default true
                                    easing: "swing",
                                    duration: 700,
                                    prev: ".jFlowPrev", // must be class, use . sign
                                    next: ".jFlowNext" // must be class, use . sign
                                });
                            });
                            </script><div id="controlador"><span class="jFlowControl jFlowSelected">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/1_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/2_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/3_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/4_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/5_ico.gif" alt="" title="">
                                    </span></div><div id="jFlowSlide" style="position: relative; width: 100%; overflow-x: hidden; overflow-y: hidden; "><div id="banners" style="position: relative; width: 1000px; height: 200px; overflow-x: hidden; overflow-y: hidden; margin-left: -164.52296117115054px; "><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7506/pascoa-premiada-ongame"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner-metin-pascoa.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7366/ta-chovendo-metin-brotando-jazida "><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner_ta_chovendo_metin.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7514/evento-ss-do-mes-abril"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/ss_mes.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7507/36-eleicao-para-imperador/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/metin_36_eleicao.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/6216/segredo-do-treinador-de-recrutas/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/m2_treinador_recrutas.jpg" alt="" title=""></a>
                                    </div></div></div></div><span class="jFlowPrev"></span><span class="jFlowNext"></span>

Resulta?

Até.
avatar

Troubleshoot
Usuário experiente

Masculino
Inscrito dia : 25/09/2011
Mensagens : 2193
Pontos Ativos : 2934

Ver perfil do usuário http://guiatecnico.ativo-forum.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 10/04/12, 04:28 pm

mesma coisa, ficou bugado

Até!
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por iPrompt em 10/04/12, 06:36 pm

Utiliza este código

Código:
<div id="box_banner_rotativo_eventos">
<script language="javascript" type="text/javascript" src="http://m2.ongame.com.br/js/jquery.flow.1.2.auto.js"></script><script language="javascript" type="text/javascript">
                            $(document).ready(function(){
                                $("#controlador").jFlow({
                                    slides: "#banners",
                                    controller: ".jFlowControl", // must be class, use . sign
                                    slideWrapper : "#jFlowSlide", // must be id, use # sign
                                    selectedWrapper: "jFlowSelected",  // just pure text, no sign
                                    auto: true,    //auto change slide, default true
                                    easing: "swing",
                                    duration: 700,
                                    prev: ".jFlowPrev", // must be class, use . sign
                                    next: ".jFlowNext" // must be class, use . sign
                                });
                            });
                            </script><div id="controlador"><span class="jFlowControl jFlowSelected">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/1_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/2_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/3_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/4_ico.gif" alt="" title="">
                                    </span><span class="jFlowControl">
                                        <img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/5_ico.gif" alt="" title="">
                                    </span></div><div id="jFlowSlide" style="position: relative; width: 100%; overflow-x: hidden; overflow-y: hidden; "><div id="banners" style="position: relative; width: 1000px; height: 200px; overflow-x: hidden; overflow-y: hidden; margin-left: -164.52296117115054px; "><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7506/pascoa-premiada-ongame"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner-metin-pascoa.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7366/ta-chovendo-metin-brotando-jazida "><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/banner_ta_chovendo_metin.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7514/evento-ss-do-mes-abril"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/ss_mes.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/7507/36-eleicao-para-imperador/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/metin_36_eleicao.jpg" alt="" title=""></a>
                                    </div></div><div class="jFlowSlideContainer" style="position: relative; width: 200px; height: 200px; float: left; overflow-x: hidden; overflow-y: hidden; "><div>
                                        <a href="http://m2.ongame.com.br/noticias/2/6216/segredo-do-treinador-de-recrutas/"><img src="http://imagem.ongame.com.br/novo_metin2/banner_evento/m2_treinador_recrutas.jpg" alt="" title=""></a>
                                    </div></div></div></div><span class="jFlowPrev"></span><span class="jFlowNext"></span></div>

Depois adiciona este código em sua Folha de estilo CSS

Código:
#capa #conteudo #esquerdo #box_banner_rotativo_eventos {
border: 1px solid #643131;
height: 200px !important;
padding: 0px;
position: absolute;
top: 207px;
width: 200px;
left: 0px;
}
#capa #conteudo #esquerdo #box_banner_rotativo_eventos #controlador {
border: 0px solid red;
margin: 180px 0 0 0px;
position: absolute;
z-index: 1;
width: 200px;
text-align: center;
}
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 10/04/12, 08:07 pm

nada bugado ainda
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por iPrompt em 10/04/12, 08:24 pm

Adiciona este código em sua Folha de estilo CSS

Código:
.controlador {
top: 80px;
}
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 10/04/12, 08:42 pm



Não resultou =/
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 11/04/12, 12:53 pm

Up Legal!
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por iPrompt em 11/04/12, 06:29 pm

Adiciona este código em sua Folha de estilo CSS

Código:
#capa #conteudo #esquerdo #box_banner_rotativo_eventos #controlador {
border: 0px solid red;
margin: 180px 0 0 0px;
position: absolute;
z-index: 1;
width: 200px;
text-align: center;
}
#capa #conteudo #esquerdo #box_banner_rotativo_eventos {
border: 1px solid #643131;
height: 200px !important;
padding: 0px;
position: absolute;
top: 207px;
width: 200px;
left: 0px;
}
avatar

iPrompt
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 10/02/2012
Mensagens : 5364
Pontos Ativos : 6851

Ver perfil do usuário http://webskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 11/04/12, 06:30 pm

nada...
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.forumeiros.com/

Resolvido Re: Codigo de slide

Mensagem por Keep em 12/04/12, 08:15 am

se alguem tiver algum parecido do mesmo tamanho, compartilhe Feliz
avatar

Keep
Nível 10

Masculino
Inscrito dia : 26/03/2012
Mensagens : 281
Pontos Ativos : 460

Ver perfil do usuário http://keepskins.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