-
Notifications
You must be signed in to change notification settings - Fork 8
/
Copy pathTestSplitFrame.html
85 lines (72 loc) · 2.91 KB
/
TestSplitFrame.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
<title>app</title></head>
<script>
function iframe1Load() {
document.getElementById("app1").contentWindow.document.body.onmousedown = function() {
window.frames['app1'].frameBeClicked = 1;
window.frames['app2'].frameBeClicked = 1;
}
}
function iframe2Load() {
document.getElementById("app2").contentWindow.document.body.onmousedown = function() {
window.frames['app1'].frameBeClicked = 2;
window.frames['app2'].frameBeClicked = 2;
}
}
function selNumOfFrameClick() {
var frame0 = document.getElementById('app0');
var frame1 = document.getElementById('app1');
var frame2 = document.getElementById('app2');
var tableFrame2Maps = document.getElementById('tableTwoMaps');
var divOneMap = document.getElementById("divOneMap");
if( document.getElementById("selNumOfFram").value =="oneFrame") {
frame0.style.width = "100%";
frame0.style.height = "95%";
frame0.style.display = 'block';
tableFrame2Maps.style.visibility= "hidden";
}
if( document.getElementById("selNumOfFram").value =="twoFrames") {
var frameHeight = divOneMap.offsetHeight;
frame0.style.display = 'none';
frame1.style.width = "100%";
frame1.style.height = frameHeight;
frame2.style.width = "100%";
frame2.style.height = frameHeight;
tableFrame2Maps.style.visibility= "visible";
}
}
</script>
<body style="overflow: auto">
<div>
<select id="selNumOfFram" style="position: absolute; left: 0; top: 5; width: 160px;" onchange="selNumOfFrameClick();" >
<option value="oneFrame" selected="selected">One Frame</option>
<option value="twoFrames">Two Frames</option>
</select>
</div>
<div>
<input type="checkbox" id="chkSynchronizeMap" style="position: absolute; left: 190; top: 5; width: 20px;" value=1>
<label for="chkSynchronizeMap" style="position: absolute; left: 220; top: 5; width: 160px;" >Synchronize Map</label>
</div>
<div id = "divOneMap" style = "margin-top: 38px;">
<iframe name="app0" id = "app0" style="width: 100%; height: 95%; " src="./index.html"></iframe>
</div>
<div >
<table id = "tableTwoMaps" style = "width: 99.4%; position: absolute; left: 4; top: 37; visibility:hidden ">
<tr>
<td>
<div >
<iframe name="app1" id = "app1" style="width: 800px; height: 760px;" src="./index.html" onload="iframe1Load()"></iframe>
</div>
</td>
<td>
<div >
<iframe name="app2" id = "app2" style="width: 800px; height: 760px;" src="./index.html" onload="iframe2Load()"></iframe>
</div>
</td>
<tr>
</table>
</div>
</body>
</html>