Help Center Manage Your Account Banner, Richmedia, and Text Ads

Expandable or rollover Flash ad

Expandable ads can occupy a smaller area (eg: 728x90) and once an action is activated, it could expand over the content to a larger area (eg: 728x240). You can serve expandable/roll-over ads within our system following these instructions:

Prepare the Flash file

Since this technique requires the Flash file to call an external JavaScript method, you need to have access to the source file (.FLA) and add the following. You need to adjust to the appropriate events for the creative (eg: on click/release or on rollover/rollout). The following example is for 728x90 expandable to 728x240 upon a mouseover event: on(rollOver) { getURL("javascript:expandCreative('ContainerDivID');"); // call the js code to expand the HTML container // you can also have additional ActionScript here if needed } on(rollOut) { getURL("javascript:collapseCreative('ContainerDivID');"); // call the js code to expand the HTML container // you can also have additional ActionScript here if needed }

Create a RichMedia/HTML ad

After you have the Flash file ready, you can enter it into our system as a RichMedia/HTML ad (choose this type when you create a new ad). For this type, you can define the size, which is the smaller size before expanding, 728x90 in our example. The Flash ad will call the JavaScript code to resize the outside container upon a user interaction. You might need to adjust the JavaScript code for vertical or horizontal expansion. The destination URL should be included in the clickTAG parameter and our system will automatically track clicks. Once the ad is created and to generate the serving code, you need to choose the JavaScript-only serving code. <script type="text/javascript"> // the example uses style.height but you can use style.width to adjust horizontally function expandCreative(d) { document.getElementById(d).style.height = "240px"; // expanded height } function collapseCreative(d) { document.getElementById(d).style.height = "90px"; // normal height } </script> <table style="width:728px; height:90px" border="0" cellpadding="0" cellspacing="0"> <tr style="padding:0px; margin:0px; border-style:none; border-width:0px"> <td style="padding:0px; margin:0px; border-style:none; border-width:0px"> <div id="OuterDivID" style="position:relative; z-index:9999; height:90px; width:728px"> <div id="ContainerDivID" style="position:absolute; z-index:9999; height:90px; top:auto; left:auto; overflow:hidden"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="728" height="240" > <param name="quality" value="high" /> <param name="movie" value="http://example.com/728_expand.swf?clickTAG=http://example.org" /> <param name="wmode" value="transparent" /> <param name="allowScriptAccess" value="always" /> <embed src="http://example.com/728_expand.swf?clickTAG=http://example.org" width="728" height="240" allowScriptAccess="always" pluginspace="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" quality="high" movie="http://example.com/728_expand.swf?clickTAG=http://example.org"></embed> </object> </div> </div> </td> </tr> </table>

Sample Code

• FLA source code:

  expandable-ad-300x250.fla

• SWF file:

  expandable-ad-300x250.swf

• A sample ad 300x250 expands to 300x450 upon rollover served live by AdSpeed:

Expanded Directions

The above code example expands to show additional content below the ad. You can easily modify it to expand from the left to the right by setting the width instead of the height attribute. Modifications are also required to expand to the left and expand up. Please contact us for the source code.

Events and Ad Interaction Tracking

You want to know how often visitors view and click on the button to download the streaming video, or to interact with the ad. You can track these post-view or view-through events with an event tracking URL. In order to get this tracking URL:

• Click on the ad name
• Copy the "Event Tracking URL" from the "Technical Details" section
• Paste it into the appropriate location where the event actually occurs

Troubleshooting Tips

• You need the Flash served within window mode (opaque or transparent) so it will not lay-over other content
• If multiple expandable ads are on a single page, you need to use distinctive DIV containers so they are not in conflict with each other
• The default value for "allowScriptAccess" has changed since Flash 8. You need "allowScriptAccess" to be "always" so that the JavaScript method is called properly.
• Since we set wmode to "transparent", if your Flash file has a transparent background, the CSS for the container can set a specific background color.

Other Articles in Banner, Richmedia, and Text Ads

• Ad Dimension
• Ad Specifications
• Ad Types
• Ad Weight or Ad Priority
• Alternative Image/Media URL
• Click Tracking URL
• Destination URL or Click URL
• Floating or layer ad
• How do I change the window title of my pop-up/pop-under ads?
• How do I track click for Flash/SWF ads?
• How do I track clicks for HTML/RichMedia ads?
• HTML "alt" attribute for ad images
• Image URL
• Peeling ad
• Polite ad or two-phase ad
• QuickTime and Windows Media ads

Cannot find an answer for your question? Ask our Customer Care team

Related Articles

• Group

  "Documentation for API methods to manage one or multiple groups. API Version1.2.5 (build 280809). Documentation was last modified on Thu,..."

  42% relevant in Manage Your Account AdSpeed API
• Campaign

  "Documentation for API methods to manage one or multiple campaigns. API Version1.2.5 (build 280809). Documentation was last modified on Thu,..."

  41% relevant in Manage Your Account AdSpeed API
• Floating or layer ad

  "Floating ad, or layer ad, is a special type of ad that flows into the page using animation upon a..."

  40% relevant in Manage Your Account Banner, Richmedia, and Text Ads
• Advertiser

  "Documentation for API methods to manage one or multiple advertisers. API Version1.2.5 (build 280809). Documentation was last modified on Thu,..."

  40% relevant in Manage Your Account AdSpeed API