Entrar
Os membros mais ativos do mês
Nenhum usuário |
Quem está conectado?
Há 1 usuário online :: 0 registrados, 0 invisíveis e 1 visitante :: 1 motor de buscaNenhum
[ Ver toda a lista ]
O recorde de usuários online foi de 23 em Seg Jun 08, 2020 3:43 am
Últimos assuntos
[TUTORIAL] Link com texto ao passar o mouse
Web ASA Fórum | Oficial :: Geral :: :: Serviços Web Sites :: Suporte Forumeiros :: Forumeiros & Você :: Tutoriais, dicas e astúcias :: Scripts HTML, BBCode e Javascript
Página 1 de 1
[TUTORIAL] Link com texto ao passar o mouse
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem] | Texto ao passar o mouse |
Muitas vezes queremos adicionar um comentário ou uma descrição à um link que criamos. Isso pode ser feito de uma forma prática e aproveitando recursos utilizados em outras partes do fórum, simplificando o código que deve ser utilizado. O conteúdo HTML é exibido ao passar o mouse sobre o link e somente desaparece quando este sai do link.
--> Tutoriais e astúcias <--
Link com texto ao passar o mouse
Link com texto ao passar o mouse
1º - Código que deve ser utilizado:
O código é bem simples. No próximo ponto iremos explicar onde o mesmo poderá ser colocado, mas de maneira geral é em qualquer local que aceite códigos HTML.
O código para o link que iremos utilizar é:
<a href="ENDEREÇO_DE_REDIRECIONAMENTO" onmouseover="createTitle(this, 'MENSAGEM', event.pageX, event.pageY);" onmouseout="destroyTitle();">TEXTO</a>
Vermelho -> Deverá substituir pelo endereço de ligação do link. Lembre-se que este deve conter um endereço de uma página.
Verde -> Representa a imagem. Mas para este teremos de ter um pouco mais de cuidado pois existem algumas regras para a construção do código, para evitar que hajam problemas: ao invés de usar aspas duplas para definir o valor de uma propriedade, não deverá colocar nada, veja o exemplo:
Ao invés disso, deverá remover estas aspas, ficando assim o código:createTitle(this, '<div class="module">Fórum dos fóruns</div>', event.pageX, event.pageY);
Preto -> O texto que será exibido no link. Ao passar o mouse sobre isso é que será exibida a mensagem.createTitle(this, '<div class=module>Fórum dos fóruns</div>', event.pageX, event.pageY);
2º - Locais em que este código pode ser utilizado:
Em geral, em qualquer lugar que aceite códigos HTML. Mas, para facilitar, trouxemos uma lista deles:
- Mensagem da Home Page:
Painel de Controle -> Visualização -> Home Page -> Geral -> "Mensagem da Home Page" - Widgets (em todos que são possíveis de criar ou modificar):
Painel de Controle -> Módulos -> Portal & Widgets -> Configuração do portal -> Estrutura
ou
Painel de Controle -> Módulos -> Portal & Widgets -> Gestão dos widgets do fórum - Newsletter's (modo HTML)
Painel de Controle -> Geral -> Newsletter -> Redação e envio - Mensagens Privadas (MP) e mensagens (com HTML ativado para as mensagens) Só terá efeito na determinada mensagem!
3º - Imagem do resultado:
(carregue na imagem para aumentar)
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
© Fórum dos Fóruns
Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [Dúvida] Link com texto ao passar o mouse |
Tópicos semelhantes
» [TUTORIAL] Mudar imagem ao passar o mouse
» [TUTORIAL] Personalizar o cursor do mouse
» [TUTORIAL] Logo rotativo
» [TUTORIAL] Substituir texto de um botão especifico no fórum
» [TUTORIAL] Link com vários textos e redirecionamentos
» [TUTORIAL] Personalizar o cursor do mouse
» [TUTORIAL] Logo rotativo
» [TUTORIAL] Substituir texto de um botão especifico no fórum
» [TUTORIAL] Link com vários textos e redirecionamentos
Web ASA Fórum | Oficial :: Geral :: :: Serviços Web Sites :: Suporte Forumeiros :: Forumeiros & Você :: Tutoriais, dicas e astúcias :: Scripts HTML, BBCode e Javascript
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos
|
|
Dom Jun 24, 2012 11:15 am por Alisson Silva
» [Re-Apresentação] Fábio
Sex maio 25, 2012 4:45 pm por Fábio
» PixelZIP ~ design&programção em só lugar
Sex maio 25, 2012 4:44 pm por Fábio
» Pedido de logo
Dom maio 20, 2012 10:06 am por Alisson Silva
» Kernel - Apresentação
Sáb maio 19, 2012 9:49 am por Alisson Silva
» [Galeria] Gabriel Schiavi - Atualizado (20/02 - !5:21)
Sáb maio 19, 2012 9:48 am por Alisson Silva
» HEBBO HOTEL 24 HORAS ONLINE !!
Sex maio 04, 2012 7:20 pm por Alisson Silva
» Pedido de Layout
Sex maio 04, 2012 5:23 pm por Fonsecca
» [RESOLVIDO]TV CCE HPS 2071-D (IMAGEM SÓ EMBAIXO, ACIMA, LINHAS DE RETRAÇO E FAIXA PRÊTA NO TOPO DA TELA).
Qua Abr 11, 2012 4:07 pm por Fry
» [contato] Deixo aqui meus contatos virtuais
Qua Abr 11, 2012 3:25 pm por Fry