This repository has been archived by the owner on Jun 3, 2024. It is now read-only.
forked from amnestywebsite/amnesty-death-penalty
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathiframe-resizer-tests.html
145 lines (104 loc) · 3.75 KB
/
iframe-resizer-tests.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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
margin: 0;
border: 0;
padding: 1em;
font-family: sans-serif;
}
h1 {
margin: 0 0 .5em;
font-size: 2em;
line-height: 1;
text-transform: uppercase;
}
p {
margin: 0 0 1em;
line-height: 1;
}
.map-wrapper {
margin: 0 0 1em;
padding: 1em;
background: #222;
color: #fff;
}
.map-wrapper h2 {
margin: 0 0 1em;
font-size: 100%;
line-height: 1;
font-weight: bold;
text-transform: uppercase;
}
.map-wrapper iframe {
width: 100%;
}
</style>
<title>Embedding the map using iFrame Resizer at different widths</title>
</head>
<body>
<h1>Embedding the map using iFrame Resizer at different widths</h1>
<p>Note: this page may take some time to load, and the iframes may take some time to resize.</p>
<div class="map-wrapper" style="width:320px;">
<h2>320 pixels wide</h2>
<iframe id="map-embed-320" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:375px;">
<h2>375 pixels wide</h2>
<iframe id="map-embed-375" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:414px;">
<h2>414 pixels wide</h2>
<iframe id="map-embed-414" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:568px;">
<h2>568 pixels wide</h2>
<iframe id="map-embed-568" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:667px;">
<h2>667 pixels wide</h2>
<iframe id="map-embed-667" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:736px;">
<h2>736 pixels wide</h2>
<iframe id="map-embed-736" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:768px;">
<h2>768 pixels wide</h2>
<iframe id="map-embed-768" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:1024px;">
<h2>1024 pixels wide</h2>
<iframe id="map-embed-1024" frameborder="0"></iframe>
</div>
<div class="map-wrapper" style="width:1366px;">
<h2>1366 pixels wide</h2>
<iframe id="map-embed-1366" frameborder="0"></iframe>
</div>
<script type="text/javascript" src="javascripts/vendor-external/iframeResizer.js"></script>
<script>
var iframeParent320 = document.querySelector('#map-embed-320');
iframeParent320.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent375 = document.querySelector('#map-embed-375');
iframeParent375.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent414 = document.querySelector('#map-embed-414');
iframeParent414.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent568 = document.querySelector('#map-embed-568');
iframeParent568.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent667 = document.querySelector('#map-embed-667');
iframeParent667.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent736 = document.querySelector('#map-embed-736');
iframeParent736.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent768 = document.querySelector('#map-embed-768');
iframeParent768.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent1024 = document.querySelector('#map-embed-1024');
iframeParent1024.src = 'index.html?cachebust='+(new Date()).getTime();
var iframeParent1366 = document.querySelector('#map-embed-1366');
iframeParent1366.src = 'index.html?cachebust='+(new Date()).getTime();
var resizediFrames = iFrameResize({}, '[id^="map-embed-"]');
</script>
</body>
</html>