Ir ao conteúdo
  • Cadastre-se

criar div dinamicamente


yagoftware

Posts recomendados

Estou criando um simulador de sistema operacional online. Agora é preciso criar janelas internas.

Ja criei uma pagina teste em que tem-se DIV's simulando janela. Mas quero que ao clicar em um botao crie novas 'janelas' dinamicamente.

segue codigo completo:




<!DOCTYPE html>
<html>
<head>
<script language="javascript" src="dragdrop.js"></script>
<script>
function createWindow(titulo="Titulo da Janela"){
var pk = new Date().getSeconds();
var H = "<div id='H"+pk+"' style='cursor:default;margin:2px;padding:2px;width:300px;color:black;border-top:none;border-left:none;border-right:none;border-bottom:2px solid black;background-color:#F4F4F4;font-size:14px;font-weight:bold;'>";
H += "<table border=0 width=300px>";
H += "<tr><td>"+titulo+"</td><td align=center onMouseOver=this.style.backgroundColor='lightgray' onMouseOut=this.style.backgroundColor='#F4F4F4' OnClick=document.getElementById("+pk+").style.display='none';>X</td></tr>";
H += "</table></div>";
var R = "<div id='R"+pk+"' style='left:20px;top:20px;position:absolute;height:350px;width:308px;background-color:#F4F4F4;border:2px solid #000000;'>";
//R += "</div>";

var html = R + H + "</div>";
document.getElementsByTagName('span')[0].innerHTML = html;
//document.body.insertBefore(html, document.getElementsByTagName('span')[0]);

var Handle = document.getElementById("H"+pk);
var Root = document.getElementById("R"+pk);
drag.init(Handle, Root); // aplica efeito drag drop na barra de titulo
}
</script>
</head>
<body bgcolor=lightgray style='width:100%;height:100%' ondblclick="alert('opa, calma, ai!')">
<button OnClick="createWindow()">Criar Window</button>
<span></span>
</body>
</html>

Link para o comentário
Compartilhar em outros sites

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...