Jascript COde / HTML / CSS Message Box
<!DOCTYPE html>
<html>
<style>
#div1 {
position:inline;
border: 2px solid #dedede;
width:200px;
background-color: #f1f1f1;
border-radius: 5px;
padding: 50px;
margin: 10px 0;
}
</style>
<body>
<p>Display the Chat Box.</p>
<button onclick="myFunction()"> CHAT </button>
<script>
var msge , msgebox, sname,div1;
function myFunction() {
div1 = document.createElement("div");
div1.id="div1";
sname = document.createElement("INPUT");
sname.setAttribute("type", "text");
msge = document.createElement("TEXTAREA");
msge.id="msge";
msgebox = document.createElement("TEXTAREA");
msgebox.rows=10;
msgebox.id="msgebox" ;
btn = document.createElement("INPUT");
btn.setAttribute("type", "button");
btn.value="SEND";
btn.id="btn";
document.body.appendChild(div1);
div1.appendChild(sname);
div1.appendChild(msge);
div1.appendChild(msgebox);
div1.appendChild(btn);
btn.addEventListener("click", send);
}
function send()
{
msgebox.append(sname.value +":" +msge.value +"\n");
}
</script>
</body>
</html>
Comments
Post a Comment