forked from ampproject/amphtml
-
Notifications
You must be signed in to change notification settings - Fork 0
/
doubleclick-multisize.amp.html
164 lines (141 loc) · 5.4 KB
/
doubleclick-multisize.amp.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
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<title>Multi-size Ad Requests with DoubleClick Examples</title>
<link rel="canonical" href="http://nonblocking.io/" >
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
<style amp-custom>
.dashedborder {
border: 2px dashed;
}
.artificialfold {
height: 900px;
background: #000;
}
</style>
</head>
<body>
<h1>Multi-size Ad Requests with DoubleClick Examples</h1>
<h2>Resize denied (above fold) - Creative should be centered</h2>
<amp-ad width=480 height=75
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
class=dashedborder
>
</amp-ad>
<h2>Secondary sizes > primary size (above fold) - Should see 'fallback'</h2>
<amp-ad width=300 height=50
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
class=dashedborder
>
<div fallback>fallback</div>
</amp-ad>
<h2>Secondary sizes == primary size - Should render</h2>
<amp-ad width=320 height=50
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
class=dashedborder
>
<div fallback>fallback</div>
</amp-ad>
<h2>Invalid multi-size attribute (above fold) - Should see 'fallback'</h2>
<amp-ad width=480 height=75
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="[320,50]"
class=dashedborder
>
<div fallback>fallback</div>
</amp-ad>
<!-- create an artificial fold -->
<div class=artificialfold></div>
<h2>Resize granted (beneath fold) - Creative should be closely wrapped by parent div</h2>
<amp-ad width=480 height=75
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
class=dashedborder
>
</amp-ad>
<h2>Invalid multi-size attribute (beneath fold) - Should be empty</h2>
<amp-ad width=480 height=75
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="[320,50]"
class=dashedborder
>
</amp-ad>
<h2>One invalid and one valid multi-size attribute - Should render</h2>
<amp-ad width=480 height=75
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="[320,50],320x50"
class=dashedborder
>
</amp-ad>
<h2>Multi-size less than 2/3rds primary size & size-validation == false - Should render</h2>
<amp-ad width=1000 height=500
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
data-multi-size-validation="false"
class=dashedborder
>
</amp-ad>
<h2>Multi-size less than 2/3rds primary size - Should be empty</h2>
<amp-ad width=1000 height=500
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
class=dashedborder
>
</amp-ad>
<h2>Multiple secondary sizes (all valid) - Should render</h2>
<amp-ad width=480 height=75
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50,350x50,350x75,400x75"
class=dashedborder
>
</amp-ad>
<h2>Responsive - Should render</h2>
<amp-ad width=100 height=149.999999925
type="doubleclick"
data-slot= "/4119129/mobile_ad_banner"
data-override-width="1030"
data-override-height="590"
data-multi-size="320x50"
data-multi-size-validation="false"
layout="responsive"
class=dashedborder
>
</amp-ad>
<h2>Size overrides - Should render with primary dimensions</h2>
<amp-ad width="500"
height="100"
data-override-width="300"
data-override-height="250"
type="doubleclick"
data-slot="/35096353/amptesting/image/static"
class=dashedborder
>
</amp-ad>
<h2>Secondary sizes > primary size (below fold) - Should be empty</h2>
<amp-ad width=300 height=50
type="doubleclick"
data-slot="/4119129/mobile_ad_banner"
data-multi-size="320x50"
class=dashedborder
>
</amp-ad>
</body>
</html>