Creating a jQuery Dialog outside Doubleclick for Publishers (SB) iframe

Question

I need to create a custom dialog served through Doubleclick for Publishers (SB). DFP SB serves it's banners via an iframe which is what is causing the problem. I have created the code for the jquery dialog but it won't break outside of the iframe and display in it's parent.

How do I get the dialog to display in relation to the parent window of the iframe and not within the iframe?

Or maybe there is a better way of doing this?

Answer 1

If you have access to the page the ad will be shown on it is pretty simple.

Move your code for the dialog to the page(s) the ad will be shown on and then simply call jQuery on the on host page from the ad iframe with something like this:

<script>
    top.$('body').append('<div>This will be appended to the host page body</div>');
</script>

Alternatively you could still build the ad inside the iframe but then 'copy' it to the host page with something like this:

<script>
    // Build element 
    $('body').append('<div id="copythis">This will be copied to the host page</div>');

    // Select element to be copied to host page
    var el = $('#copythis');

    // Insert into host page
    top.$('body').append(el);
</script>

Hopefully that is enough to get you down the right path. If not post your code and I will take another look.