Specifications
Image Floating
- Dimensions: 600x600px or 700x700px
- Weight Limit: 100KB
- Formats: JPG, PNG, GIF
HTML Floating
- Dimensions: 600x600px or 700x700px
- Weight Limit: 100KB
- Be sure to use clickLayer instead of making the whole banner window clickable - clicking the close button should not trigger clickTAG
Close button is added by Delfi Meedia before uploading the banner. Close button should not be added by banner creator / designer.
The ad will automatically close 5 seconds after being shown, unless mouse is hovered over.
The ad will be shown at most once per unique user and will not be served to new users and users without cookies.
Banner Settings
- Position: Center/Center
- Is the position fixed: yes
- Show after: 0.1s
- Close after: 5s
- Page overlay: yes
- Overlay color: #000000
- Overlay opacity: 50
Best practices
Try to avoid adding too much text or text with a small font.
Try to make the banner as light-weight as possible - considering the banner is only shown for 5 seconds, loading speed of the banner is critical.
Try to have a transparent effect where it appears as if the banner is coming from the site, rather than is being laid on top of it.
<style>
#adf-close-button {
height: 30px;
width: 30px;
position: absolute;
right: 6px;
top: 6px;
background-color: transparent;
background-repeat: no-repeat;
background-position: center;
background-image: url('https://g.delfi.ee/b/close2016.png');
cursor: pointer;
-webkit-transition: transform 0.25s ease-out, opacity 0.25s linear 0.4s;
-moz-transition: transform 0.25s ease-out, opacity 0.25s linear 0.4s;
-o-transition: transform 0.25s ease-out, opacity 0.25s linear 0.4s;
transition: transform 0.25s ease-out, opacity 0.25s linear 0.4s;
border: 2px solid rgba(255, 255, 255, 0.5);
border-radius: 20px;
opacity: 1;
}
#adf-close-button:hover {
transform: rotate(90deg);
}
</style>
<div id="adf-close-button"></div>
<script>
document.getElementById('adf-close-button').addEventListener('click', function() {
dhtml.sendEvent(dhtml.CLOSE_BUTTON_PRESS);
dhtml.external.close();
}, false);
</script>
Limitations
Banner is not shown on Delfi frontpage
Templates