Interscroller

Interscroller banner is an effective full-view banner in mobile that is fixed to view but under content and displayed only when scrolled over a gap in the content. This effectivly causes a cool semi-parallax effect

Interscroller banner is either 360x640px single image or a responsive html5 banner. Image is set as background, center aligned and scaled to be contained with in screen size. Html5 banner is shown through a responsive iframe but is responsible for its own responsiveness.

Interscroller is fixed to device screen size but different devices and different browsers handle browser- and device-bars differently, avoid designing to the edge. Especially the top and bottom edges. Keep the content as center as possible for the best effect.

Example

Example with image Example with video

Limitations

Intercroller banners can not be interactive - the click layer is placed on top of the banner and no click/touch events reach the banner. This for example means that multiple clicktags can not be used.

Inscreen statistics are not calculated for Interscoller.

Video elements should have autoplay enabled but in-view setting disabled - as the inscreen position calucation doesn't work - any video with in-view setting enabled would never play. Videos should have no audio track - as they would need to be muted in order for autoplay to work and the can not be unmuted - as there is no user inateraction to unmute the video.

Specifications

Sinlge image interscroller
A single image that is positioned center aligned on the background.


HTML5 interscroller
A responsive HTML5 banner that is positioned is shown through a responsive iframe. The banner is reponsible for its own responisveness.


Best practices