topical media & game development

talk show tell print

sample-js-parallax.htm / htm



  <head>
  
  <style type="text/css" media="screen, projection">
    
      #parallax
        {position:relative; overflow:hidden; width:60em; height:20em;}
        
  </style>
  
  <script type="text/javascript" src="lib-jquery.js"></script>
  <script type="text/javascript" src="lib-jparallax.js"></script>
  <script type="text/javascript">
    <!--
  
    jQuery(document).ready(function(){
    
        jQuery('#parallax').jparallax({});
        return false;
    
    });
    
    //-->
    </script>
  </head>
  <body>
  <div id="parallax" class="clear">
  <div style="width: 860px; height: 273px; position: absolute; left: 14.4635%; margin-left: -124.386px; top: 78.1392%; margin-top: -213.32px;">
                      <img src="lib-jquery-plugin-parallax-parallax-files-0-sun.png" alt="" style="position: absolute; left: 300px; top: -12px;">
              </div>
  <div style="width: 920px; height: 274px; position: absolute; left: 14.4635%; margin-left: -133.064px; top: 78.1392%; margin-top: -214.102px;">
                      <img src="lib-jquery-plugin-parallax-parallax-files-1-mountains.png" alt="">
              </div>
  <div style="width: 1100px; height: 284px; position: absolute; left: 14.4635%; margin-left: -159.098px; top: 78.1392%; margin-top: -221.915px;">
                      <img src="lib-jquery-plugin-parallax-parallax-files-2-hill.png" alt="" style="position: absolute; top: 40px; left: 0pt;">
              </div>
  <div style="width: 1360px; height: 320px; position: absolute; left: 14.4635%; margin-left: -196.703px; top: 78.1392%; margin-top: -250.046px;">
                      <img src="lib-jquery-plugin-parallax-parallax-files-3-wood.png" alt="" style="position: absolute; top: 96px; left: 0pt;">
              </div>
  </body>
  


(C) Æliens 27/08/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.