<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="Google Web Designer 16.1.0.0530">
<meta name="template" content="Banner 3.0.0">
<meta name="environment" content="gwd-dv360">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="gwdpage_style.css" rel="stylesheet" data-version="13" data-exports-type="gwd-page">
<link href="gwdpagedeck_style.css" rel="stylesheet" data-version="14" data-exports-type="gwd-pagedeck">
<link href="gwdgooglead_style.css" rel="stylesheet" data-version="9" data-exports-type="gwd-google-ad">
<link href="gwdimage_style.css" rel="stylesheet" data-version="17" data-exports-type="gwd-image">
<style id="gwd-lightbox-style">
.gwd-lightbox {
overflow: hidden;
}
</style>
<style id="gwd-text-style">
p {
margin: 0px;
}
h1 {
margin: 0px;
}
h2 {
margin: 0px;
}
h3 {
margin: 0px;
}
</style>
<style>
html, body {
width: 100%;
height: 100%;
margin: 0px;
}
.gwd-page-container {
position: relative;
width: 100%;
height: 100%;
}
.gwd-page-content {
background-color: transparent;
transform: perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
position: absolute;
transform-style: preserve-3d;
}
.gwd-page-content * {
transform-style: preserve-3d;
}
.gwd-page-wrapper {
background-color: rgb(255, 255, 255);
position: absolute;
transform: translateZ(0px);
}
.gwd-page-size {
width: 120px;
height: 600px;
}
.gwd-image-6jz3 {
position: absolute;
width: 121px;
height: 601px;
left: -1px;
top: 0px;
}
.gwd-image-1ugs {
position: absolute;
transform-origin: 50% 50% 0px;
left: -82px;
top: 301px;
width: 305px;
height: 306px;
transform: scale3d(1.4, 1.4, 1.4);
}
@keyframes gwd-gen-14f9gwdanimation_gwd-keyframes {
0% {
transform: scale3d(1.4, 1.4, 1.4);
animation-timing-function: cubic-bezier(0.755, -0.003, 0.145, 1.007);
}
100% {
transform: scale3d(1, 1, 1);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-14f9gwdanimation {
animation: 1.9s linear 0s 1 normal forwards running gwd-gen-14f9gwdanimation_gwd-keyframes;
}
.gwd-image-8xuq {
position: absolute;
transform-origin: 50% 50% 0px;
left: 43px;
width: 77px;
height: 81px;
top: 128px;
transform: translate3d(20px, 0px, 0px) rotateZ(46deg) scale3d(1.5, 1.5, 1.5);
visibility: inherit;
}
@keyframes gwd-gen-1wesgwdanimation_gwd-keyframes {
0% {
transform: translate3d(20px, 0px, 0px) rotateZ(46deg) scale3d(1.5, 1.5, 1.5);
animation-timing-function: ease;
--gwd-visibility-range: 500, ;
}
100% {
transform: translate3d(0px, 0px, 0px) rotateZ(0deg) scale3d(1, 1, 1);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-1wesgwdanimation {
animation: 3.3s linear 0.5s 1 normal forwards running gwd-gen-1wesgwdanimation_gwd-keyframes;
}
.gwd-image-1bzt {
position: absolute;
transform-origin: 50% 50% 0px;
left: -48px;
top: 267px;
width: 106px;
height: 111px;
opacity: 0;
transform: translate3d(-8px, 3px, 0px) rotateZ(-62deg);
visibility: inherit;
}
@keyframes gwd-gen-day0gwdanimation_gwd-keyframes {
0% {
transform: translate3d(-8px, 3px, 0px) rotateZ(-62deg);
opacity: 0;
animation-timing-function: linear;
--gwd-visibility-range: 500, ;
}
21.2121% {
transform: translate3d(1px, 3px, 0px) rotateZ(-42.6225deg);
opacity: 1;
animation-timing-function: linear;
}
100% {
transform: translate3d(11px, 3px, 0px) rotateZ(-2deg);
opacity: 1;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-day0gwdanimation {
animation: 3.3s linear 0.5s 1 normal forwards running gwd-gen-day0gwdanimation_gwd-keyframes;
}
.gwd-image-z9oo {
position: absolute;
width: 91px;
height: 91px;
left: 15px;
top: 15px;
transform: scale3d(0.74, 0.74, 0.74);
opacity: 1;
}
@keyframes gwd-gen-zqk2gwdanimation_gwd-keyframes {
0% {
opacity: 1;
animation-timing-function: linear;
}
100% {
opacity: 1;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-zqk2gwdanimation {
animation: 1s linear 0s 1 normal forwards running gwd-gen-zqk2gwdanimation_gwd-keyframes;
}
@keyframes gwd-gen-1siigwdanimation_gwd-keyframes {
0% {
transform: translate3d(-101px, 184px, 0px) rotateZ(-19.9827deg) scale3d(0.001, 0.001, 0.001);
animation-timing-function: cubic-bezier(0.775, -0.008, 0.125, 1.002);
--gwd-visibility-range: 200, ;
}
100% {
transform: translate3d(-101px, 184px, 0px) rotateZ(-10.7161deg) scale3d(0.72, 0.72, 0.72);
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-1siigwdanimation {
animation: 1.3s linear 0.2s 1 normal forwards running gwd-gen-1siigwdanimation_gwd-keyframes;
}
.gwd-image-1dcs {
position: absolute;
transform-origin: 50% 50% 0px;
top: 21px;
left: 75px;
width: 174px;
height: 92px;
transform: translate3d(-101px, 184px, 0px) rotateZ(-19.9827deg) scale3d(0.001, 0.001, 0.001);
visibility: inherit;
}
@keyframes gwd-gen-1nt7gwdanimation_gwd-keyframes {
0% {
transform: translate3d(13px, 398px, 0px) scale3d(1, 1, 1);
opacity: 0;
animation-timing-function: ease-out;
--gwd-visibility-range: 1500, ;
}
100% {
transform: translate3d(13px, 346px, 0px) scale3d(1.2, 1.2, 1.2);
opacity: 1;
animation-timing-function: linear;
}
}
#page1.gwd-play-animation .gwd-gen-1nt7gwdanimation {
animation: 0.4s linear 1.5s 1 normal forwards running gwd-gen-1nt7gwdanimation_gwd-keyframes;
}
.gwd-image-1efy {
position: absolute;
width: 85px;
height: 21px;
left: 4px;
top: 212px;
opacity: 0;
transform-origin: 50% 50% 0px;
visibility: inherit;
transform: translate3d(13px, 398px, 0px) scale3d(1, 1, 1);
}
</style>
<script data-source="gwd_webcomponents_v1_min.js" data-version="2" data-exports-type="gwd_webcomponents_v1" src="gwd_webcomponents_v1_min.js"></script>
<script data-source="gwdpage_min.js" data-version="13" data-exports-type="gwd-page" src="gwdpage_min.js"></script>
<script data-source="gwdpagedeck_min.js" data-version="14" data-exports-type="gwd-pagedeck" src="gwdpagedeck_min.js"></script>
<script data-source="https://s0.2mdn.net/ads/studio/Enabler.js" data-exports-type="gwd-google-ad" src="https://s0.2mdn.net/ads/studio/Enabler.js"></script>
<script data-source="gwdgooglead_min.js" data-version="9" data-exports-type="gwd-google-ad" src="gwdgooglead_min.js"></script>
<script data-source="gwdimage_min.js" data-version="17" data-exports-type="gwd-image" src="gwdimage_min.js"></script>
</head>
<body>
<gwd-google-ad id="gwd-ad" polite-load="">
<gwd-pagedeck class="gwd-page-container" id="pagedeck">
<gwd-page id="page1" class="gwd-page-wrapper gwd-page-size gwd-lightbox" data-gwd-width="120px" data-gwd-height="600px">
<div class="gwd-page-content gwd-page-size">
<gwd-image id="120x600" source="assets/120x600.png" scaling="stretch" class="gwd-image-6jz3"></gwd-image>
<gwd-image id="Headphone1" source="assets/Headphone1.png" scaling="stretch" class="gwd-image-8xuq gwd-gen-1wesgwdanimation"></gwd-image>
<gwd-image id="Headphone2" source="assets/Headphone2.png" scaling="stretch" class="gwd-image-1bzt gwd-gen-day0gwdanimation"></gwd-image>
<gwd-image id="woofer_burger_image" source="assets/woofer_burger_image.png" scaling="stretch" class="gwd-image-1ugs gwd-gen-14f9gwdanimation"></gwd-image>
<gwd-image id="mcd_logo" source="assets/mcd logo.png" scaling="stretch" class="gwd-image-z9oo gwd-gen-zqk2gwdanimation"></gwd-image>
<gwd-image id="NEW_McCrispy" source="assets/NEW McCrispy.png" scaling="stretch" class="gwd-image-1dcs gwd-gen-1siigwdanimation"></gwd-image>
<gwd-image id="OrderNow" source="assets/OrderNow.png" scaling="stretch" class="gwd-image-1efy gwd-gen-1nt7gwdanimation"></gwd-image>
</div>
</gwd-page>
</gwd-pagedeck>
</gwd-google-ad>
<script type="text/javascript" id="gwd-init-code">
(function() {
var gwdAd = document.getElementById('gwd-ad');
/**
* Handles the DOMContentLoaded event. The DOMContentLoaded event is
* fired when the document has been completely loaded and parsed.
*/
function handleDomContentLoaded(event) {
}
/**
* Handles the WebComponentsReady event. This event is fired when all
* custom elements have been registered and upgraded.
*/
function handleWebComponentsReady(event) {
// Start the Ad lifecycle.
requestAnimationFrame(function() {
setTimeout(function() {
gwdAd.initAd();
}, 1);
});
}
/**
* Handles the event that is dispatched after the Ad has been
* initialized and before the default page of the Ad is shown.
*/
function handleAdInitialized(event) {}
window.addEventListener('DOMContentLoaded',
handleDomContentLoaded, false);
window.addEventListener('WebComponentsReady',
handleWebComponentsReady, false);
window.addEventListener('adinitialized',
handleAdInitialized, false);
})();
</script>
</body>
</html>
12
2
55KB
161KB
231.0ms
245.0ms
231.0ms