main code
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>page</title>
<style>
body{
margin:0;
padding:0;
font-family:Verdana;
background:#b88c00
}
.box{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%)
}
.tog{
padding:5px;
border:2px solid #000;
width:150px;
margin:10px;
cursor:pointer;
transition:.5s;
}
.tog:hover{
background:#000;
color:#fff;
}
</style>
</head>
<body>
<div class="box">
<div class="tog" id="openWindow">Open Window</div>
<div class="tog" id="closeWindow">Close Window</div>
</div>
<script>
var Wopen = document.getElementById("openWindow"),
Wclose = document.getElementById("closeWindow"),
settings = "width=500px,height=500px,top=200px,left=200px,resizable=no";
Wopen.onclick = function () {
Mywindow = window.open("1.page.html", "examplePage", settings)
}
Wclose.onclick = function () {
Mywindow.close();
}
//var pencere = window.open('2.page.html', 'orneksayfa', 'width=600,height=600')
//pencere.focus()
//pencere.onload = function () {
// var h1 = pencere.document.createElement('h1')
// h1.innerHTML = ' TEST SAYFASINA H1 ETİKETİNİ YAZDIRDIM'
// h1.style.color = 'red';
// pencere.document.body.insertBefore(h1, pencere.document.body.firstChild)
//}
</script>
</body>
</html>
1.page.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>page</title>
<link rel="stylesheet" type="text/css" href="1.page.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css">
</head>
<body>
<h3>Registration form</h3>
<table>
<tr>
<td class="left">Name</td>
<td class="right"><input type="text" name="name" /></td>
</tr>
<tr>
<td class="left">Surname</td>
<td class="right"><input type="text" name="surname" /></td>
</tr>
<tr>
<td class="left">Email</td>
<td class="extra"><input type="email" name="email" />
<select>
<option>hotmail.com</option>
<option>gmail.com</option>
<option>mynet.com</option>
<option>outlook.com</option>
</select></td>
</tr>
<tr>
<td class="left">phone number</td>
<td class="right"><input type="number" name="phone_number" /></td>
</tr>
<tr>
<td class="left">Password</td>
<td class="right"><input type="password" name="Password" /></td>
</tr>
</table>
</body>
</html>
Leave a comment