JSFiddle - React, Tailwind, and code Playground

by Ronny

HTML

<iframe class="Ad" id="ad13-TopMedRect" width="300" height="250"></iframe>
<script>ads.render({placement: "ad13-TopMedRect", url:"http://www.google.com"});</script>

<script class="Ad" id="ad11"></script>
<script>ads.render({placement: "ad11", url:"http://www.cornify.com/js/cornify.js", studio:"movie_trailers", hd: "yes"});</script>

<!-- Example use of ad11, just to make sure it works -->
<button onclick="cornify_add()">Make me happy</button>

CSS

.Ad {outline: 1px solid #DDD; overflow: hidden; border: none;}
button {position: absolute; top: 40px; right: 10px;}

JavaScript

var Ads = new Class({
    Implements: [Options, Events],
    initialize: function(options){
        this.setOptions(options);
        this.options.ads = {};
        this.initClientSideValues();
    },
    initClientSideValues:function(){
        this.options.clientSide = {
            ORD: Math.random(),
            userID: '2347422'
        }
    },
    render: function(adData){
        this.options.ads[adData.placement] = adData;
        var adDataUrl =  adData.url
                        + '?'
                        + Object.toQueryString(this.options.clientSide);
        
        $(adData.placement).set('src', adDataUrl);
    }
});

var ads = new Ads();