Info: see the Demo

The IAB Slider ad consists of the following required elements:

• Slider Bar;
• Slider Content.

Note: 300x250 banner is also included for MSN.

Slider Bar is anchored to the bottom of the browser's window and in front of the publisher page's content.

A click or a rollover triggers the publisher's page to slide to the left, revealing the Slider Content on the right.

The Slider Bar persists to enable retraction.

Using the Close button or clicking on the Slide Back arrow slides the Slider Content back to the right by bringing the publisher's content to its original position.

1. The easiest way to create a Slider is using Adform Creative Toolkit template for an IAB Slider (both AS2 and AS3 supported):

2. Edit SliderBar.fla and SliderContent.fla if necessary.

Note: banner with a property Expand on = "RollOver" is configured, its Expand Delay property automatically is set to 3 seconds, unless you specify you own value greater than 3 seconds.  

3. Export the.swf file.

Below is a Slider Bar and Slider Content asset codes (AS3) for reference:

Slider Bar example:

import flash.display.LoaderInfo;
import flash.external.ExternalInterface;

import com.adform.motion.AdformTween;
import com.adform.display.AdformStage;
import com.adform.motion.easing.Regular;

var adId:String;
var isExpanded:Boolean = false;
var bgCount:uint = 1;
var contentWidth:uint = 950;
var baseWidth:int = Math.max(contentWidth, stage.stageWidth);
var diff:Number = (stage.stageWidth - baseWidth) / 2;

Security.allowDomain("*");

AdformStage.stage = this.stage;
            
setTimeout(this.init, 0);

function init():void
{
    stage.scaleMode = StageScaleMode.NO_SCALE;
    stage.align = StageAlign.TOP_LEFT;
    stage.addEventListener(Event.RESIZE, handleStageResize);
            
    left.closeBtn.addEventListener(MouseEvent.CLICK, handleCloseClick);
    left.extendBtn.addEventListener(MouseEvent.CLICK, handleExpandClick);
    right.backBtn.addEventListener(MouseEvent.CLICK, handleCollapseClick);
    adId = LoaderInfo(stage.loaderInfo).parameters.adId;
            
    if (ExternalInterface.available)
    {
        ExternalInterface.addCallback("expandStart", expandStart);
        ExternalInterface.addCallback("collapseStart", collapseStart);
    }
    handleStageResize();
}
        
function handleCloseClick(e:MouseEvent):void
{
    try{
        ExternalInterface.call('ADFSuperClose', adId);
    }catch (e:Error) { };
}
        
function collapseStart(endTime:Number):void
{
    isExpanded = false;
    var collapseTime:Number = (endTime - new Date().getTime()) / 1000;
    AdformTween.to(this, collapseTime,
        {
            x: diff,
            ease: Regular.easeInOut
        });
}
        
function expandStart(endTime:Number):void
{
    isExpanded = true;
    var expandTime:Number = (endTime - new Date().getTime()) / 1000;
    AdformTween.to(this, expandTime,
        {
            x: diff - baseWidth,
            ease: Regular.easeInOut
        });
}
        
function handleCollapseClick(e:MouseEvent):void
{
    try{
        ExternalInterface.call('ADFClose', adId);
    }catch (e:Error) { };
}
    
function handleExpandClick(e:MouseEvent):void
{
    try{
        ExternalInterface.call('ADFExpand', adId);
    }catch (e:Error) {  };
}

function handleStageResize(e:Event = null):void
{
    baseWidth = Math.max(contentWidth, stage.stageWidth);
    diff = (stage.stageWidth - baseWidth) / 2;
    
    x = diff - (isExpanded ? baseWidth : 0);

    left.x = (baseWidth - contentWidth) / 2;
    right.x = left.x + baseWidth;

    var times:uint =  Math.ceil(baseWidth * 2 / this.bg.width);
    for (var i:uint = bgCount; i < times; i++)
    {
        var _bg:MovieClip = new Background();
        _bg.x = i * _bg.width;
        addChildAt(_bg, getChildIndex(bg))
    }
    bgCount = (bgCount < times) ? times : bgCount;
}

Slider Content code example:

import flash.display.LoaderInfo;
import flash.display.Stage;
import flash.display.StageScaleMode;
import flash.external.ExternalInterface;
import com.adform.events.AdformEventDispatcher;
import com.adform.events.AdformVideoEvent;
import com.adform.display.AdformStage;

var adId:String;

Security.allowDomain("*");

AdformStage.stage = this.stage;

setTimeout(this.init, 0);

function init():void
{
    stage.scaleMode = StageScaleMode.SHOW_ALL;
    btn.addEventListener(MouseEvent.CLICK, handleBtnClick);
    adId = LoaderInfo(stage.loaderInfo).parameters.adId;
    
    if (ExternalInterface.available)
    {
        ExternalInterface.addCallback("expandEnd", expandEnd);
    }
}

function expandEnd(endTime:Number = 0):void
{
    AdformEventDispatcher.dispatchAdformEvent( new AdformVideoEvent(AdformVideoEvent.PLAY, ["videoPlayer"]) );
}

function handleBtnClick(e:MouseEvent):void
{
    AdfURLNavigator.navigateToUrl(AdfFlashVarsUtil.getParameter('clickTAG'));