Still using Internet Explorer?

You'll have a happier experience on the TRU website — and most other sites — if you update to a modern web browser such as Firefox, Chrome, or Edge. You can continue to use Internet Explorer for certain tasks, such as using Banner.

Thompson Rivers University 50th Anniversary
Thompson Rivers University 50th Anniversary

Parallax Images

Parallax backgrounds

Parallax backgrounds can add interest to an article. However, they should be used sparingly as they are not guaranteed to be compatible on all devices.

They are automatically hidden on mobile devices and swapped out for background images using the following methods. Content can be inserted above the background; it should be tested to make certain the content does not overflow on mobile screens.

The background height is fixed at 400px.

<div class="parallax-window parallax-bg hide-for-small" data-parallax="scroll" data-image-src="https://placeimg.com/1000/600/animals" data-z-index="1"></div>
<div class="parallax-content" style="background-image: url('https://placeimg.com/1000/600/animals');"></div>

Until you try, you do not know what you cannot do.

<div class="parallax-window parallax-bg hide-for-small" data-parallax="scroll" data-image-src="https://placeimg.com/1000/500/arch" data-z-index="1"></div>
<div class="columns contentArea parallax-content" style="background-image: url('https://placeimg.com/1000/500/arch');">
<h3 class="absolute-middle nomargin text-center">Until you try, you do not know what you cannot do.</h3>
</div>
Search To Top