Como faço esse modelo?

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

Resolvido Como faço esse modelo?

Mensagem por nikkibs em 28/06/12, 06:23 am

Qual é minha questão:
Oi gostaria de saber qual o codigo html e css (pq pelo visto tem o codigo css tbm pelos pop ups) dos adms desse fórum:

http://testecolinaimperial.forumeiros.com/

Aos donos do fórum não se preoculpem, irei editar e não ficará igual

Links e imagens do meu problema:
Não é necessário.

Endereço do meu fórum:
http://www.bsfanfics.forumeiros.com

Versão do meu fórum:
PHPBB2


Última edição por nikkibs em 29/06/12, 05:41 pm, editado 1 vez(es)
avatar

nikkibs
Nível 9

Feminino
Inscrito dia : 16/05/2012
Mensagens : 211
Pontos Ativos : 306

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

Resolvido Re: Como faço esse modelo?

Mensagem por ~Fly em 28/06/12, 06:25 am

Olá, sou o dono do fórum, não entendi... você quer o que ?
avatar

~Fly
Usuário destaque

Masculino
Inscrito dia : 26/12/2011
Mensagens : 689
Pontos Ativos : 1006

Ver perfil do usuário http://bleachlasnochesrpg.ultimaterpg.net/

Resolvido Re: Como faço esse modelo?

Mensagem por nikkibs em 28/06/12, 07:30 am

Queria saber como faço aquela "caixa" com os adms e a flecha que vai virando a pagina x.x
avatar

nikkibs
Nível 9

Feminino
Inscrito dia : 16/05/2012
Mensagens : 211
Pontos Ativos : 306

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

Resolvido Re: Como faço esse modelo?

Mensagem por ~Fly em 28/06/12, 01:21 pm

Ahh siim...

Aceda :

PControle > Visualização > Home Page > Geral > Conteúdo da mensagem. :

Código:
<style>
    #sld img{
    width: 80px;
    height: 80px;
    border: 1px solid gray;
    }
      .tooltip {
        display:none;
        background:transparent url(http://jquerytools.org/media/img/tooltip/black_arrow.png);
        font-size:12px;
        height:70px;
        width:160px;
        padding:25px;
        color:#eee;
    font-weight: bold;
      }

    #sld img{overflow: auto;width: 100px;height: 100px;border: 1px solid gray;}.tooltip {display:none;background:transparent url(http://jquerytools.org/media/img/tooltip/black_arrow.png);font-size:12px;height:70px;width:160px;padding:25px;color:#eee;font-weight: bold;}#sld {font-size: 12px;}
    </style>

      <link rel="stylesheet" type="text/css"
          href="http://jquerytools.org/media/css/scrollable-horizontal.css" />
    <link rel="stylesheet" type="text/css"
          href="http://jquerytools.org/media/css/scrollable-buttons.css" />

<script>jQuery(function() {// initialize scrollablejQuery(".scrollable").scrollable();});</script><script>jQuery(function() {jQuery("#sld img[title]").tooltip();});</script>



    <!-- javascript coding -->
    <script>
    jQuery(function() {
      // initialize scrollable
      jQuery(".scrollable").scrollable();
    });
    </script>
    <script>
      jQuery(function() {
          jQuery("#sld img[title]").tooltip();
        });
    </script>

  <script type="text/javascript">
            //<!--
                    function change_onglet(name)
                    {
                            document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
                            document.getElementById('onglet_'+name).className = 'onglet_1 onglet';
                            document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
                            document.getElementById('contenu_onglet_'+name).style.display = 'block';
                            anc_onglet = name;
                    }
            //-->
            </script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
  <div style="margin:0 auto; width: 634px; height:120px;">
    <!-- "previous page" action -->
    <a class="prev browse left"></a>

    <!-- root element for scrollable --><div class="scrollable" id="scrollable">

      <!-- root element for the items -->
      <div class="items">

        <!-- 1-5 -->
        <div id="sld">
          <a href="http://campcolinaimperialv3.forumeiros.com/u1"><img src="http://i46.tinypic.com/33kyy2p.jpg" title="Hades - Administrador e Fundador
          <a href="http://campcolinaimperialv3.forumeiros.com/u6">
<img src="http://c3.quickcachr.fotos.sapo.pt/i/o09097880/11325712_vRG7S.png"title="Hefesto/Vulcano - Administrador, Co-Fundador, Designer e Code ." />
          <a href="http://campcolinaimperialv3.forumeiros.com/u5">
<img src="http://i39.tinypic.com/16hr9f7.jpg"title="Apolo - Administrador." />
          <a href="http://campcolinaimperialv3.forumeiros.com/u15">
<img src="http://i32.tinypic.com/2wdx8rb.png"title="Íris - Administradora e Ideologista." /></a>
        </div>

        <!-- 5-10 -->
        <div id="sld">
          <a href="http://campcolinaimperialv3.forumeiros.com/u16">
<img src="http://i43.servimg.com/u/f43/17/33/98/10/hipnos10.jpg"title="Hipnos - Administrador." /></a>
          <a href="http://campcolinaimperialv3.forumeiros.com/u3">
<img src="http://i.imgur.com/eKx5m.png"title="Poseidon - Administrador." />
          <a href="http://campcolinaimperialv3.forumeiros.com/u37">
<img src="http://r29.imgfast.net/users/2916/21/38/42/avatars/37-68.jpg"title="Phobos -  Game Master" />
          <a href="http://campcolinaimperialv3.forumeiros.com/u2">
<img src="http://i.imgur.com/DVd8x.png"title="Zeus -  Administrador" /></a>

        </div>

        <!-- 10-15 -->
        <div id="sld">
          <a href="http://campcolinaimperialv3.forumeiros.com/u8">
<img src="http://s18.postimage.org/nh06hkz1j/hermesm.jpg"title="Hermes -  Administrador" /></a>
        </div>


      </div>

    </div>


Nota : <!-- 1-5 --> <!-- 5-10 --> <!-- 10-15 -->

É o numero de usuários que vai ficar numa pagina.

Nota² : Cada pagina aguenta 4 Usuários, não cinco.

Abraços,

~Apple

Aceito +rep.
avatar

~Fly
Usuário destaque

Masculino
Inscrito dia : 26/12/2011
Mensagens : 689
Pontos Ativos : 1006

Ver perfil do usuário http://bleachlasnochesrpg.ultimaterpg.net/

Resolvido Re: Como faço esse modelo?

Mensagem por nikkibs em 28/06/12, 02:15 pm

Oi.. então... as flechas sumiram, olha:

http://testesbestseller.forumeiros.com/forum
avatar

nikkibs
Nível 9

Feminino
Inscrito dia : 16/05/2012
Mensagens : 211
Pontos Ativos : 306

Ver perfil do usuário http://www.bsfanfics.forumeiros.com
  • 0

Resolvido Re: Como faço esse modelo?

Mensagem por ~Fly em 28/06/12, 02:18 pm

Hm, irei editar essa resposta.

Eu passei com a seta e foi... mais irei modificar o código zen

Tente este código :

Código:
 <style>
    #sld img{
    width: 80px;
    height: 80px;
    border: 1px solid gray;
    }
      .tooltip {
        display:none;
        background:transparent url(http://jquerytools.org/media/img/tooltip/black_arrow.png);
        font-size:12px;
        height:70px;
        width:160px;
        padding:25px;
        color:#eee;
    font-weight: bold;
      }

    #sld img{overflow: auto;width: 100px;height: 100px;border: 1px solid gray;}.tooltip {display:none;background:transparent url(http://jquerytools.org/media/img/tooltip/black_arrow.png);font-size:12px;height:70px;width:160px;padding:25px;color:#eee;font-weight: bold;}#sld {font-size: 12px;}
    </style>

      <link rel="stylesheet" type="text/css"
          href="http://jquerytools.org/media/css/scrollable-horizontal.css" />
    <link rel="stylesheet" type="text/css"
          href="http://jquerytools.org/media/css/scrollable-buttons.css" />

<script>jQuery(function() {// initialize scrollablejQuery(".scrollable").scrollable();});</script><script>jQuery(function() {jQuery("#sld img[title]").tooltip();});</script>



    <!-- javascript coding -->
    <script>
    jQuery(function() {
      // initialize scrollable
      jQuery(".scrollable").scrollable();
    });
    </script>
    <script>
      jQuery(function() {
          jQuery("#sld img[title]").tooltip();
        });
    </script>

  <script type="text/javascript">
            //<!--
                    function change_onglet(name)
                    {
                            document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
                            document.getElementById('onglet_'+name).className = 'onglet_1 onglet';
                            document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
                            document.getElementById('contenu_onglet_'+name).style.display = 'block';
                            anc_onglet = name;
                    }
            //-->
            </script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
  <div style="margin:0 auto; width: 634px; height:120px;">
    <!-- "previous page" action -->
    <a class="prev browse left"></a>

    <!-- root element for scrollable --><div class="scrollable" id="scrollable">

      <!-- root element for the items -->
      <div class="items">

        <!-- 1-5 -->
        <div id="sld">
          <a href="http://campcolinaimperialv3.forumeiros.com/u1"><img src="http://i46.tinypic.com/33kyy2p.jpg" title="Hades - Administrador e Fundador
          <a href="http://campcolinaimperialv3.forumeiros.com/u6">
<img src="http://c3.quickcachr.fotos.sapo.pt/i/o09097880/11325712_vRG7S.png"title="Hefesto/Vulcano - Administrador, Co-Fundador, Designer e Code ." />
          <a href="http://campcolinaimperialv3.forumeiros.com/u5">
<img src="http://i39.tinypic.com/16hr9f7.jpg"title="Apolo - Administrador." />
          <a href="http://campcolinaimperialv3.forumeiros.com/u15">
<img src="http://i32.tinypic.com/2wdx8rb.png"title="Íris - Administradora e Ideologista." /></a>
        </div>

        <!-- 5-10 -->
        <div id="sld">
          <a href="http://campcolinaimperialv3.forumeiros.com/u16">
<img src="http://i43.servimg.com/u/f43/17/33/98/10/hipnos10.jpg"title="Hipnos - Administrador." /></a>
          <a href="http://campcolinaimperialv3.forumeiros.com/u3">
<img src="http://i.imgur.com/eKx5m.png"title="Poseidon - Administrador." />
          <a href="http://campcolinaimperialv3.forumeiros.com/u37">
<img src="http://r29.imgfast.net/users/2916/21/38/42/avatars/37-68.jpg"title="Phobos -  Game Master" />
          <a href="http://campcolinaimperialv3.forumeiros.com/u2">
<img src="http://i.imgur.com/DVd8x.png"title="Zeus -  Administrador" /></a>

        </div>

        <!-- 10-15 -->
        <div id="sld">
          <a href="http://campcolinaimperialv3.forumeiros.com/u8">
<img src="http://s18.postimage.org/nh06hkz1j/hermesm.jpg"title="Hermes -  Administrador" /></a>
        </div>


      </div>

    </div>

    <a class="next browse right"></a>
    </div><div style="margin:auto;text-align:center;width:100%">

É por que tem vários códigos juntos ai eu tive que separar Louco

Conseguiu ?

Aceito +rep
avatar

~Fly
Usuário destaque

Masculino
Inscrito dia : 26/12/2011
Mensagens : 689
Pontos Ativos : 1006

Ver perfil do usuário http://bleachlasnochesrpg.ultimaterpg.net/

Resolvido Re: Como faço esse modelo?

Mensagem por nikkibs em 28/06/12, 03:03 pm

Oi achei melhor tirar print do que esta acontecendo x.x

avatar

nikkibs
Nível 9

Feminino
Inscrito dia : 16/05/2012
Mensagens : 211
Pontos Ativos : 306

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

Resolvido Re: Como faço esse modelo?

Mensagem por Convidad em 29/06/12, 03:04 pm

Olá autor!

Confira as informações do seguinte tópico: http://ajuda.forumeiros.com/t59568-slid-de-membros

Atenciosamente,
Shek

Convidad
Convidado


Resolvido Re: Como faço esse modelo?

Mensagem por nikkibs em 29/06/12, 05:40 pm

Muito obrigada *-* Funcionou agora *-* Só preciso me entender com o codigo html pra não atropelar o forum mas isso eu consigo ^^
avatar

nikkibs
Nível 9

Feminino
Inscrito dia : 16/05/2012
Mensagens : 211
Pontos Ativos : 306

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