Como criar um pop up DHTML com código pronto

Este código em dhtml permite que você crie uma janela de pop up ou caixa de apresentação de conteúdo. Ela é compatível com o internet explorer, firefox e opera.

Além disso, ela pode ser arrastada pelo usuário e ainda inclui um botão de fechamento. Pode ser usada tanto para destacar algum conteúdo quanto para informar algo aos seus visitantes. A grande vantagem é que este pop up não pode ser bloqueado facilmente.

Instalando o Pop up.

Copie e cole o javascript abaixo entre as tags <head> </head> do da página onde você quer que este pop up em dhtml apareça. Não é preciso fazer nenhum tipo de modificação nesse primeiro script

Personalizando o código

Insira o código html a seguir no pé da página, antes da tag </body>. Todas as alterações na aparência da janela de pop up em dhtml são feitas no código abaixo. Nele é possível mudar o tamanho da janela de pop up, o local onde ela aparece etc.

<div id="showimage" style="position:absolute;width:250px;left:250px;top:250px">

<table border="0" width="250" bgcolor="#000080" cellspacing="0" cellpadding="2">
<tr>
<td width="100%"><table border="0" width="100%" cellspacing="0" cellpadding="0"
height="36px">
<tr>
<td id="dragbar" style="cursor:hand; cursor:pointer" width="100%" onMousedown="initializedrag(event)"><ilayer width="100%" onSelectStart="return false"><layer width="100%" onMouseover="dragswitch=1;if (ns4) drag_dropns(showimage)" onMouseout="dragswitch=0"><font face="Verdana"
color="#FFFFFF"><strong><small>Título do seu pop up</small></strong></font></layer></ilayer></td>
<td style="cursor:hand"><a href="#" onClick="hidebox();return false"><img src="botaodefecharjanela.gif" width="16px"
height="14px" border=0></a></td>
</tr>
<tr>
<td width="100%" bgcolor="#FFFFFF" style="padding:4px" colspan="2">

<!– Por seu conteúdo aqui –>

testando

<!– Fim do conteúdo –>

</td>
</tr>
</table>
</td>
</tr>
</table>
</div>

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *