[TUTORIAL] Iframe onClick

Item: [TUTORIAL] Iframe onClick
Rating: 1

por Luciano98 em 02/04/12, 11:36 pm

Como criar um Inframe onClick

Neste tutorial será ensinado como colocar uma imagem no canto superior do fórum que, quando um membro clicar nela, apresente uma página externa na sua página actual, criando um efeito para parcerias!

--> Tutoriais, dicas e astúcias <--
Como criar um Inframe onClick

1º - Noção básica da função:
Estaremos adicionando o código na Home Page do fórum, ou em qualquer campo que aceite HTML como os próprios Widgets. Aqui nesta função, estaremos usando o campo da Home Page.

Painel de controle :seta2:

Visualização :seta2:

HomePage

Geral

Assunto da mensagem Correspondente ao nome da home page que será criada.

Conteúdo da mensagem Campo destinado para receber o código abaixo:

<img onClick="$(this).next().toggle();" src="endereco-da-imagem" style="cursor:pointer; position:fixed; right: 0; top: 0; z-index: 3;" /><div style="display:none; width: 100%; height:100%; position:fixed; top:0; left:0;z-index:2;background-image:url(http://i49.tinypic.com/k9ytsx.png);"><iframe style="position: fixed; top: 5%; left: 5%;height: 93%;width: 93%;" src="endereço-completo-da-pagina"></iframe></div>

Verde Representa o endereço da imagem que deverá ser clicada, poderá ser em qualquer formato de imagem.
Azul Deverá substituir pelo endereço completo da página que pretende que seja mostrada, incluindo a barra "/" no final do mesmo, isto é, com "/".

4º - Resultado:

(espere a imagem carregar para aumentar)

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
Como criar um Inframe onClick