Follow

Overview

Sizmek Creative AdKit Suite for HTML5 ad developers, contains ad-related functionalities that enable you to develop HTML5 ads quickly and easily. For more information on AdKit, see OVERVIEW: Sizmek AdKit HTML5 API.

Usingthe Sizmek AdKit, you can configure a panel to expand to full screen using for HTML5 Expandable ads. The full screen size depends on the device on which the ad is served. When the ad expands to full screen, the panel size does not change, but a border is added around the panel to fit the full screen. This border is defined as the background, whereas the panel is considered the foreground area. 

The following example illustrates how the ad remains the same size across all platforms and the background changes to match the screen size.

The Expand to Full Screen action contains the background settings. These settings include the background color, the opacity, and the close button. The default background is set to white.

Implementation

 Code

 

                                                                                                                                                                              

AdKit.Expand(
panelName:
expandToMax:
Background:{
       type:"solidColor","gradientColor","image"
       image:
       color: 
       colors:[{
                   color:
                   opacity:
                   percent:
                  }]
       direction:
       opacity:
          }

closeButton:{
         alignment:
         image:

    } );

Field  Description
PanelName The panel name needs to match the panel name defined in the platform.
Background 
 type: "solidColor","gradientColor","image                

Set the background color. Supported values are:

  • Image: You can add the image as an additional asset or using a URL. The image is duplicated to fit the background and is not expanded or decreased to fit the background.
  • solidColor: The background color is defined according to the hexadecimal color. Colors in HTML are specified by a hash (#) followed by a six-digit hexadecimal number. This number consists of three 2-digit numbers corresponding to red, green and blue (RGB) values. #FFFFFF is white and is set as the default color.
  • gradientColor: The gradient is defined using color, opacity and percent.
direction

Set the direction the panels expands. Supported values are:

  • down ,up, left, right
opacity Set the opacity of the solid color type.
CloseButton 
Alignment

Set the location of the close button on the panel. Supported values are:

  • topRight (default), topLeft, bottomRight, BottomLeft 
Image Set the image button. The default button is . You can add the image as an additional asset or using a URL.

 

 

 

 

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments