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.
Conectar-se

Esqueci minha senha

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
cdul1f6sd
 
Luiz
 
iScroll
 
Ketholy123
 
Fou-Lu
 
Matt Shultz
 
Harleen
 
Shek
 
zHugh
 
T1ag0
 

Quem está conectado
297 usuários online :: 3 usuários cadastrados, 1 Invisível e 293 Visitantes :: 2 Motores de busca

cdul1f6sd, PlayWillian, zHugh

[ Ver toda a lista ]


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

Personalizar spoiler com pergaminho

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

Resolvido Personalizar spoiler com pergaminho

Mensagem por BichodoMato em 21/07/16, 10:23 am

Detalhes da questão


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

Descrição


Olá, gostaria de alterar a imagem do spoiler do meu fórum para uma de pergaminho, assim quando clica-se no rolo fechado ele abre e revela as informações contidas no 'papel' do rolo. As imagens são essas:

Pergaminho inteiro:

Rolo:

Papel:

Além disso, eu gostaria que o 'Papel' fosse repetido sempre que o conteúdo do pergaminho terminasse, assim não teria limites para onde o papel se expandiria.

Eu fiz um tópico bem similar à esse no passado e esta neste link: http://ajuda.forumeiros.com/t96885-alterar-exibicao-de-spoiler-para-tipo-pergaminho-naruto

Obrigado a quem puder ajudar!
avatar

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 06/07/2013
Mensagens : 340
Pontos Ativos : 563

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

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por Sennior em 21/07/16, 01:29 pm

Saudações! Muito feliz

Vá em:
Painel de controle  Seta curta Visualização  Seta curta Cores Seta curta "Aba" Folha CSS.

Código:
dl.codebox.spoiler {
    background: url(http://i65.tinypic.com/29gg3h5.png);
    padding: 30px;
    background-repeat: no-repeat;
    background-position-x: 95px;
    border: none!important;
}dl.codebox dt {
    border-bottom: none!important;
}.spoiler_content.hidden {
    background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
    background-repeat: repeat-y;
    background-position-x: 68px;
    position: relative;
    top: 22px;
}
.spoiler_content.hidden {
    text-align: center;
    width: 55%;
    padding: 0pc 158px 4pc 9pc;
}
.spoiler_content.hidden {
   position: relative;
    top: 22px;

}
.spoiler_content {
position: relative;
background-position-x: 0px;
top: -21px;
left: -11px;
}
.spoiler_content {
background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
background-repeat: repeat-y;
color: #10pt;
padding: 20px 78px 40px 63px;
text-align: justify;
}

Salve e Visualize seu fórum. Piscada
Melhores cumprimentos,
Sennior. De bem com a vida
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20790

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por BichodoMato em 21/07/16, 02:36 pm

Algumas coisas ficaram fora de alinhamento, tive de alterar o código ao meu gosto, porém ainda não consegui resolver algo: o título do spoiler está do lado do rolo do pergaminho, tem como deixa-lo ligeiramente abaixo?

Aqui o código já com algumas alterações feitas:

Código:
dl.codebox.spoiler {
    background: url(http://i65.tinypic.com/29gg3h5.png);
    padding: 30px;
    background-repeat: no-repeat;
    background-position-x: 95px;
    border: none!important;
}dl.codebox dt {
    border-bottom: none!important;
}.spoiler_content.hidden {
    background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
    background-repeat: repeat-y;
    background-position-x: 80px;
    position: relative;
    top: 22px;
}
.spoiler_content.hidden {
    text-align: justify;
    width: 55%;
    padding: 0pc 158px 4pc 9.5pc;
}
.spoiler_content.hidden {
  position: relative;
    top: 22px;
 
}
.spoiler_content {
position: relative;
background-position-x: 0px;
top: -21px;
left: -11px;
}
.spoiler_content {
background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
background-repeat: repeat-y;
color: #000000;
padding: 20px 76px 40px 63px;
text-align: justify;
font-size: 11px;
}
avatar

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 06/07/2013
Mensagens : 340
Pontos Ativos : 563

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

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por Sennior em 21/07/16, 02:42 pm

Saudações! Muito feliz

Vá em:
Painel de controle  Seta curta Visualização  Seta curta Cores Seta curta "Aba" Folha CSS.

Código:
dl.codebox dt {
    border-bottom: none!important;
    text-align: center!important;
    position: relative;
    top: 50px;
}dl.codebox.spoiler {
    background: url(http://i65.tinypic.com/29gg3h5.png);
    padding: 30px;
    background-repeat: no-repeat;
    background-position-x: 95px;
    border: none!important;
}dl.codebox dt {
    border-bottom: none!important;
}.spoiler_content.hidden {
    background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
    background-repeat: repeat-y;
    background-position-x: 80px;
    position: relative;
    top: 22px;
}
.spoiler_content.hidden {
    text-align: justify;
    width: 55%;
    padding: 0pc 158px 4pc 9.5pc;
}
.spoiler_content.hidden {
  position: relative;
    top: 22px;
 
}
.spoiler_content {
position: relative;
background-position-x: 0px;
top: -21px;
left: -11px;
}
.spoiler_content {
background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
background-repeat: repeat-y;
color: #000000;
padding: 20px 76px 40px 63px;
text-align: justify;
font-size: 11px;
}

Salve e Visualize seu fórum. Piscada
Melhores cumprimentos,
Sennior. De bem com a vida
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20790

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por BichodoMato em 21/07/16, 03:27 pm

Agora ele sumiu e.e
avatar

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 06/07/2013
Mensagens : 340
Pontos Ativos : 563

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

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por Sennior em 22/07/16, 09:27 am

Ora! Sumiu? Em choque
O senhor retirou o código antigo? Eu não alterei nada que ele pudesse sumir. Rindo

Mande -me teu CSS e volte a tentar este código, adicionando-o no inicio de teu CSS:
Código:
dl.codebox dt {
    border-bottom: none!important;
    text-align: center!important;
    position: relative;
    top: 50px;
}dl.codebox.spoiler {
    background: url(http://i65.tinypic.com/29gg3h5.png);
    padding: 30px;
    background-repeat: no-repeat;
    background-position-x: 95px;
    border: none!important;
}dl.codebox dt {
    border-bottom: none!important;
}.spoiler_content.hidden {
    background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
    background-repeat: repeat-y;
    background-position-x: 80px;
    position: relative;
    top: 22px;
}
.spoiler_content.hidden {
    text-align: justify;
    width: 55%;
    padding: 0pc 158px 4pc 9.5pc;
}
.spoiler_content.hidden {
  position: relative;
    top: 22px;
 
}
.spoiler_content {
position: relative;
background-position-x: 0px;
top: -21px;
left: -11px;
}
.spoiler_content {
background-image: url(http://i39.servimg.com/u/f39/19/08/53/62/oie_kb12.png);
background-repeat: repeat-y;
color: #000000;
padding: 20px 76px 40px 63px;
text-align: justify;
font-size: 11px;
}

Até mais.
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20790

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por BichodoMato em 26/07/16, 10:34 am

Obrigado. Pode fechar.
avatar

BichodoMato
Usuário avançado

Masculino
Inscrito dia : 06/07/2013
Mensagens : 340
Pontos Ativos : 563

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

Resolvido Re: Personalizar spoiler com pergaminho

Mensagem por while em 26/07/16, 12:03 pm

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3107
Pontos Ativos : 4515

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

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