index.html 3.55 KB
<!DOCTYPE html>
    <head><script type="text/javascript">
    
      (function() {
        var relegateNavigation = '';
        var handleClickTagMessage = function(e) {
          try {
            var eventData = JSON.parse(e.data);
          } catch (err) {
            return;
          }
          if (eventData.isInitClickTag) {
            if (eventData.clickTags) {
              for (var i = 0; i < eventData.clickTags.length; i++) {
                var clkTag = eventData.clickTags[i];
                window[clkTag.name] = clkTag.url;
              }
            } else if (eventData.clickTag) {
              window.clickTag = eventData.clickTag;
            }
            relegateNavigation = eventData.relegateNavigation;
          }
        };

        if (open.call) {
          window.open = function(open) {
            return function(url, name, features) {
              if (relegateNavigation === 'parent') {
                var message = {'clickTag': url, 'isPostClickTag': true};
                parent.postMessage(JSON.stringify(message), '*');
              } else {
                var args = [url, name];
                if (features) {
                  args.push(features);
                }
                open.apply(window, args);
              }
            };
          }(window.open);
        }

        if (window.addEventListener) {
          window.addEventListener(
              'message', handleClickTagMessage, false);
        } else {
          window.attachEvent('onmessage', handleClickTagMessage);
        }
      })();
    
  </script>
        <meta charset="utf-8">
        <title>HTML5 Ad</title>
        <meta name="ad.size" content="width=300,height=600">
        <script type="text/javascript">
            var clickTag = "https://thecommonwell.ca/wave/";
        </script>
        
        
        <style>
            
            body{
                margin: 0;
                padding: 0;
                width: 300px;
                height: 600px;
                line-height: 1.2;
                font-size: 27px;
                letter-spacing: .4;
                color: #CD040B;
                font-family: "Neue Haas Grotesk", Arial, sans-serif;
                /*font-weight: 800;*/ /*BOLD-800, MEDIUM-600, ROMAN - 400*/
                font-style: normal;

                
            }
            
            a{
                text-decoration: none;
                color: inherit;
            }
            
            #border{
                position: relative;
                width: 300px;
                height: 600px;
                border: 1px solid #55565A;
                background-color: #FFFFFF;
                overflow: hidden;
                cursor: pointer;
				box-sizing: border-box;
            }
            
            #border:hover  #cta{
                background-color: #666666;
            }
            
            #border:active  #cta{
                background-color: #000000;
            }
            
			#video{
                position: absolute;
                left:13px;
                top:15px;
            }
            
        </style>
    </head>
    
    <body>
        <a href="javascript:window.open(window.clickTag)">
        <div id="border">
            <div id="img"><img id="logoImg" src="assets/img@2x.gif" width="300" height="600" style="border-style:none"></div>
            <iframe id="video" src="https://player.vimeo.com/video/162541360" width="272" height="160" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
        </div>
        </a>

    </body>

</html>