1 Replies - 6059 Views - Last Post: 19 November 2012 - 07:25 PM

#1 nK0de  Icon User is offline

  • Catch me As Exception
  • member icon

Reputation: 206
  • View blog
  • Posts: 823
  • Joined: 21-December 11

Full screen parallax background

Posted 17 November 2012 - 11:45 PM

I'm learning how to use the parallax effects using the jParallax jQuery plugin. So far what I have done works fine but I need to make the parallax affect the whole screen. I applied it to the body tag but that doesn't work apparently. Here is how it looks.

Here's the code.

<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.parallax.css" />
<style type="text/css">
.parallax-viewport {

<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="js/jquery.parallax.js"></script>
<script type="text/javascript" src="js/jquery.event.frame.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
    $('#parallax .parallax-layer')
      mouseport: $('#parallax')


<body id="parallax" class="parallax-viewport">

    <div class="parallax-layer" style="width:600px; height:274px;">
        <img src="images/background_layers/bottom_layer.png" />
    <div class="parallax-layer" style="width:1100px; height:284px;">
        <img src="images/background_layers/mid_layer.png" />
    <div class="parallax-layer" style="width:1360px; height:320px;">
        <img src="images/background_layers/top_layer.png" />


How can I fill the whole screen with the parallax background?

I did change the .parallax-viewport class' height from 20em to 100% but that didn't change anything.

Any help would be great! Thanks very much. :)

Is This A Good Question/Topic? 0
  • +

Replies To: Full screen parallax background

#2 BobRodes  Icon User is offline

  • Lovable Curmudgeon
  • member icon

Reputation: 594
  • View blog
  • Posts: 3,055
  • Joined: 19-May 09

Re: Full screen parallax background

Posted 19 November 2012 - 07:25 PM

You could try adding the classes to the window object maybe?
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1