jQuery selectors in The Playground

PLAYGROUND ads are built together with a number of iframes on-top of the publisher page. For this reason, when targeting elements in your ad through jQuery (included by default in all PLAYGROUND ads) you'll need to specify which part of the ad the element you're targeting resides.

For example, normally you would do this


But for this to work in a Top and Tail you also need to let jQuery know which part of the ad you're referencing. So the above would become:


The 'docs' part refers to the documents (or iframes) within the ad. The 'top'  part references the iframe called top. All our templates have the docs reference already established for you to use. For a quick reference, the documents within our formats are: 

  • Side Push
    • docs.spTop - main side push panel
    • docs.collapseBtn - x close button
    • docs.expandBtn - > re-engagement button
    • docs.banner - standard banner
  • Super Skin
    • docs.banner - standard banner
    • docs.hero - hero and expanded frame
    • docs.background - background (skin sides)
  • Top & Tail
    • - top unit
    • docs.tail - tail unit
    • docs.closeTop - top unit's close button
    • docs.closeTail - tail unit's close button
    • docs.banner - standard banner

If this doesn't make sense, or doesn't work for you please email with the URL of your build.


Please sign in to leave a comment.
Powered by Zendesk