We want to replicate the format of the top-of-page ad placement used in the desktop view of [login to view URL] (and any movie page on [login to view URL])? We will use this code to display advertising on participating websites.
Note: We've had occasional issues accessing example pages directly. If you have issues visit [login to view URL] and click the name of any film or TV program.
SCOPE OF WORK
We are looking for a solution that will deliver the container, behaving as required. This can be tested by serving static images in place of real adverts. Note, we just need to code for the container, not to handle ad unit loading.
EXAMPLE OF AD UNIT BEHAVIOUR
I have made a video showing the desired behaviour here: [login to view URL]
The placement we are interested in appears at the top of each of the pageviews shown in the video. On the first pageview it loads a vodafone creative, on the second a larger Wayfair one.
SPECIFIC BEHAVIOUR REQUIREMENTS
* A container loads, sized to fit its contents
* The container appears at the top of the screen, pushing content down to create space
* The first time the user scrolls down the page, the container scrolls more slowly than the surrounding page, keeping it in view for longer before it eventually scrolls out of view
* [optional] if the user scrolls back up the page, the container will behave as a normal container if they scroll down again (locking in position)
* If empty, the container should not take space or noticeably affect the behaviour of the page
Note: in the video the first ad unit is slow to load. This is a result of my connection and the size of that creative rather than being deliberate or desirable behaviour.
* The solution should work on most websites
* Code (including any required libraries) should be lightweight
* The solution must be in one self-contained JS file (we will host this centrally, with participating sites calling the script remotely from our server)
Please let me know if you have further questions