[TUTORIAL] Efeito Back to Top com uso de javascript
Página 1 de 1 • Compartilhe
[TUTORIAL] Efeito Back to Top com uso de javascript
![]() | Back to top somente com javascript |
As vezes gostaríamos de ter um efeito que faça com que possamos subir até ao topo do fórum. Neste tutorial vamos poder fazer o efeito Back to top somente com o uso de javascript.
--> Tutoriais, dicas e astúcias <--
Back to top somente com javascript
Back to top somente com javascript
1º - Paginas Javascript:
As páginas javascript ativas em seu fórum possibilita inserir scripts e jquery para personalizar seu fórum, contudo é importante saber que qualquer script encontrado na internet acabam por não surgir efeito nos fóruns.
Painel de controle ![]() ![]() ![]() |
![[TUTORIAL] Efeito Back to Top com uso de javascript Painel13](https://i.servimg.com/u/f48/15/88/72/83/painel13.png)
![]() | ![]() |
![]() | ![]() |
![]() | ![]() |
![]() | ![]() |
2º - Código a ser usado:
Coloque esse código no conteúdo do javascript:
![]() | PHPBB3 |
- Código:
$(function() {
$('#page-footer').append('<a href="#top"><img src="http://i21.servimg.com/u/f21/18/45/41/65/top10.png" title="Voltar ao topo" alt="Voltar ao topo"></a><style>a[href="#top"] { background:#000;left:650px;border: 1px solid white; height: 16px !important; width: 18px !important; padding: 10px; position: absolute !important; margin-top: 10px !important; border-radius: 50%; }</style>');
});
![]() | PHPBB2 |
- Código:
$(function() {
$('#page-footer').append('<a href="#top"><img src="http://i21.servimg.com/u/f21/18/45/41/65/top10.png" title="Voltar ao topo" alt="Voltar ao topo"></a><style>a[href="#top"] { background:#000;left:650px;border: 1px solid white; height: 16px !important; width: 18px !important; padding: 10px; position: absolute !important; margin-top: 10px !important; border-radius: 50%; }</style>');
});
![]() | PUNBB |
- Código:
$(function() {
$('#pun-foot').append('<a href="#top"><img src="http://i21.servimg.com/u/f21/18/45/41/65/top10.png" title="Voltar ao topo" alt="Voltar ao topo"></a><style>a[href="#top"] { background:#000;left:650px;border: 1px solid white; height: 16px !important; width: 18px !important; padding: 10px; position: absolute !important; margin-top: 10px !important; border-radius: 50%; }</style>');
});
![]() | INVISION |
- Código:
$(function() {
$('#gfooter').append('<a href="#top"><img src="http://i21.servimg.com/u/f21/18/45/41/65/top10.png" title="Voltar ao topo" alt="Voltar ao topo"></a><style>a[href="#top"] { background:#000;left:650px;border: 1px solid white; height: 16px !important; width: 18px !important; padding: 10px; position: absolute !important; margin-top: 30px !important; border-radius: 50%; }</style>');
});
© Fórum dos Fóruns
![]() | Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: Fazer efeito Back to top somente com javascript |
![-](https://2img.net/i/fa/fdf3/moins10.png)
» Javascript não surtiu efeito.
» Efeito utilizando Javascript
» Retiro JavaScript e efeito continua
» Código JavaScript do Chatbox não surtiu efeito
» Editar esse javascript - de um tutorial
» Efeito utilizando Javascript
» Retiro JavaScript e efeito continua
» Código JavaScript do Chatbox não surtiu efeito
» Editar esse javascript - de um tutorial
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos