Como criar um botão "Ir ao topo" no template?
2 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1 • Compartilhe
Como criar um botão "Ir ao topo" no template?
Detalhes da questão
Endereço do fórum: http://forumeiros-slew.forumeiros.com/forum
Versão do fórum: PunBB
Descrição
Olá @shrek e @fraise pode me ajudar nessa questão? concerteza será resolvida de primeira,não é algo tão dificil eu acho,mas para mim é...
gostaria que personalizasse meu overall_footer_end, com o icone "topo" dessa forma:
aqui está meu overall_footer_end
- Código:
<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
<div>
<div>
<div>
<div>
<div>
<ul>
<li>
<!-- END html_validation -->
</li>
</ul>
<!-- BEGIN switch_footer_links -->
<ul>
<li>
<!-- BEGIN footer_link -->
<!-- BEGIN switch_separator --> | <!-- END switch_separator -->
{switch_footer_links.footer_link.FOOTER_LINK_SEPARATOR}<a name="bottom" class="copyright" href="{switch_footer_links.footer_link.U_FOOTER_LINK_HREF}" rel="{switch_footer_links.footer_link.FOOTER_LINK_REL}" target="{switch_footer_links.footer_link.FOOTER_LINK_TARGET}" title="{switch_footer_links.footer_link.L_FOOTER_LINK_TITLE}">{switch_footer_links.footer_link.L_FOOTER_LINK_TEXT}</a>
<!-- END footer_link -->
</li>
</ul>
<!-- END switch_footer_links -->
</div>
<br />
<p class="center">
<strong>{ADMIN_LINK}</strong>
</p>
</div>
{PROTECT_FOOTER}
</div>
</div>
</div>
</div>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
appId: '{switch_facebook_login.FACEBOOK_APP_ID}',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
//]]>
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
FB.Event.subscribe('auth.logout', function(response) {
if ($('a#logout'))
{
var lien_redir = $('a#logout').attr('href');
if ($('a#logout').attr('href') && $('a#logout').attr('href') != '')
{
document.location.href = 'http://{switch_facebook_logout.SERVER_NAME}/' + lien_redir;
}
}
});
$(document).ready( function() {
$('a#logout').click( function() {
FB.logout();
} );
} );
//]]>
</script>
<!-- END switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
fa_endpage();
//]]>
</script>
</body>
<footer>
<div class="FP_center">
<div class="FP_colum" id="pp_copyright">
<h2>editavel</h2>
<li><a href="/f8-criacao-grafica" target="_blanck">editavel</a></li>
<li><a href="/f9-skins" target="_blanck">editavel</a></li>
<li><a href="/f10-dicas-e-tutoriais" target="_blanck">editavel</a></li>
<li><a href="/c2-suporte-a-forumeiros" target="_blanck">editavel</a></li>
</div>
<div class="FP_colum">
<h2>editavel</h2>
<li><a href="/u1">editavel</a></li>
<li><a href="/">editavel</a></li>
<li><a href="/">editavel</a></li>
<li><a href="/">editavel</a></li>
</div>
<div class="FP_colum">
<h2>Forumeiros</h2>
<li><a href="http://www.forumeiros.com/criar-forum/phpbb3">Criar um Fórum</a></li>
<li><a href="http://www.forumeiros.com/beneficios-do-forum">Beneficios de um Forum</a></li>
<li><a href="http://www.forumeiros.com/condicoes-gerais">Condições Gerais</a></li>
<li><a href="http://www.forumeiros.com/ferramentas">Ferramenta do Fundador</a></li>
</div>
</div>
</footer>
</html>
<style>
/********************FOOTER*******************/
footer {
background: #1A1E25;
border-bottom: 1px solid #363A43;
border-top: 7px solid #0066CC;
font-size: 13px;
overflow: hidden;
padding-bottom: 20px;
color: #62747B;
}
footer a:link, footer a:visited {
color: #62747B;
text-decoration: none;
}
footer a:hover {
color: #0066CC;
text-decoration: none;
}
footer .FP_center {
width: 1000px;
margin: auto;
}
footer .FP_colum {
width: 291px;
float: left;
height: 150px;
padding: 10px 20px;
border-right: 1px dashed rgba(0, 0, 0, 0.22);
border-left: 1px dashed rgba(255, 255, 255, 0.09);
}
footer .FP_colum:first-child {
border-left: 0;
}
footer .FP_colum:last-child {
border-right: 0;
}
footer .FP_colum h2 {
color: #0066CC;
}
footer .FP_colum li {
display: block;
padding: 7px 0;
border-top: 1px dashed rgba(0, 0, 0, 0.17);
border-bottom: 1px dashed rgba(255, 255, 255, 0.06);
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
footer .FP_colum li:first-child {
border-top: 0;
}
footer .FP_colum li:last-child {
border-bottom: 0;
}
footer .FP_colum li:hover {
padding: 7px 7px;
}
.FP_colum li:before {
content: '';
height: 0;
width: 0;
float: left;
border: solid 7px transparent;
border-left-color: #0066CC;
}
</style>
Última edição por Rafusqui_ em 11.11.15 16:04, editado 1 vez(es)
Re: Como criar um botão "Ir ao topo" no template?
Olá e boa tarde!
Lamento, mas, o suporte ao seu tópico correspondente ao fórum serão limitados, por não estar dentro dos termos e condições de Forumeiros. Você poderá entender mais acessando este link: https://ajuda.forumeiros.com/t14313-por-que-o-suporte-ao-meu-topico-foi-limitado
Para sua dúvida, modifique seu template para:
Atenciosamente,
Shek
Lamento, mas, o suporte ao seu tópico correspondente ao fórum serão limitados, por não estar dentro dos termos e condições de Forumeiros. Você poderá entender mais acessando este link: https://ajuda.forumeiros.com/t14313-por-que-o-suporte-ao-meu-topico-foi-limitado
Para sua dúvida, modifique seu template para:
- Código:
<!-- BEGIN html_validation -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div>
<div>
<div>
<div>
<div>
<div>
<ul>
<li>
<!-- END html_validation -->
</li>
</ul>
<!-- BEGIN switch_footer_links -->
<ul>
<li>
<!-- BEGIN footer_link -->
<!-- BEGIN switch_separator --> | <!-- END switch_separator -->
{switch_footer_links.footer_link.FOOTER_LINK_SEPARATOR}<a name="bottom" class="copyright" href="{switch_footer_links.footer_link.U_FOOTER_LINK_HREF}" rel="{switch_footer_links.footer_link.FOOTER_LINK_REL}" target="{switch_footer_links.footer_link.FOOTER_LINK_TARGET}" title="{switch_footer_links.footer_link.L_FOOTER_LINK_TITLE}">{switch_footer_links.footer_link.L_FOOTER_LINK_TEXT}</a>
<!-- END footer_link -->
</li>
</ul>
<!-- END switch_footer_links -->
</div>
<br />
<p class="center">
<strong>{ADMIN_LINK}</strong>
</p>
</div>
{PROTECT_FOOTER}
</div>
</div>
</div>
</div>
<!-- BEGIN switch_facebook_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
appId: '{switch_facebook_login.FACEBOOK_APP_ID}',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
//]]>
</script>
<!-- END switch_facebook_login -->
<!-- BEGIN switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
FB.Event.subscribe('auth.logout', function(response) {
if ($('a#logout'))
{
var lien_redir = $('a#logout').attr('href');
if ($('a#logout').attr('href') && $('a#logout').attr('href') != '')
{
document.location.href = 'http://{switch_facebook_logout.SERVER_NAME}/' + lien_redir;
}
}
});
$(document).ready( function() {
$('a#logout').click( function() {
FB.logout();
} );
} );
//]]>
</script>
<!-- END switch_facebook_logout_TMP -->
<script type="text/javascript">
//<![CDATA[
fa_endpage();
//]]>
</script>
</body>
<div id="TOP"><a href="#top" title="Ir ao topo"><img src="http://i18.servimg.com/u/f18/18/21/41/30/arrow11.png" alt="Ir ao topo" style="position: relative;top: 7px;right: -50%;"></a></div>
<footer>
<div class="FP_center">
<div class="FP_colum" id="pp_copyright">
<h2>editavel</h2>
<li><a href="/f8-criacao-grafica" target="_blanck">editavel</a></li>
<li><a href="/f9-skins" target="_blanck">editavel</a></li>
<li><a href="/f10-dicas-e-tutoriais" target="_blanck">editavel</a></li>
<li><a href="/c2-suporte-a-forumeiros" target="_blanck">editavel</a></li>
</div>
<div class="FP_colum">
<h2>editavel</h2>
<li><a href="/u1">editavel</a></li>
<li><a href="/">editavel</a></li>
<li><a href="/">editavel</a></li>
<li><a href="/">editavel</a></li>
</div>
<div class="FP_colum">
<h2>editavel</h2>
<li><a href="/u1">editavel</a></li>
<li><a href="/">editavel</a></li>
<li><a href="/">editavel</a></li>
<li><a href="/">editavel</a></li>
</div>
</div>
</footer>
</html>
<style>
/********************FOOTER*******************/
footer {
background: #1A1E25;
border-bottom: 1px solid #363A43;
border-top: 7px solid #0066CC;
font-size: 13px;
overflow: hidden;
padding-bottom: 20px;
color: #62747B;
}
footer a:link, footer a:visited {
color: #62747B;
text-decoration: none;
}
footer a:hover {
color: #0066CC;
text-decoration: none;
}
footer .FP_center {
width: 1000px;
margin: auto;
}
footer .FP_colum {
width: 291px;
float: left;
height: 150px;
padding: 10px 20px;
border-right: 1px dashed rgba(0, 0, 0, 0.22);
border-left: 1px dashed rgba(255, 255, 255, 0.09);
}
footer .FP_colum:first-child {
border-left: 0;
}
footer .FP_colum:last-child {
border-right: 0;
}
footer .FP_colum h2 {
color: #0066CC;
}
footer .FP_colum li {
display: block;
padding: 7px 0;
border-top: 1px dashed rgba(0, 0, 0, 0.17);
border-bottom: 1px dashed rgba(255, 255, 255, 0.06);
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
footer .FP_colum li:first-child {
border-top: 0;
}
footer .FP_colum li:last-child {
border-bottom: 0;
}
footer .FP_colum li:hover {
padding: 7px 7px;
}
.FP_colum li:before {
content: '';
height: 0;
width: 0;
float: left;
border: solid 7px transparent;
border-left-color: #0066CC;
}
</style>
Atenciosamente,
Shek
Re: Como criar um botão "Ir ao topo" no template?
Obrigado, resolvido.
Tópicos semelhantes
» Como criar template para minhas postagens
» Criar o menu de usuário no topo
» Criar o Botão voltar ao topo
» Como colocar template
» Criar um espaçamento entre o topo e o conteúdo
» Criar o menu de usuário no topo
» Criar o Botão voltar ao topo
» Como colocar template
» Criar um espaçamento entre o topo e o conteúdo
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos