|
|
| Line 8: |
Line 8: |
| | <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script> | | <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script> |
| | | | |
| - | <!-- Remove all empty <p> tags -->
| + | |
| - | <script type="text/javascript">
| + | |
| - | $(document).ready(function() {
| + | |
| - | $("p").filter( function() {
| + | |
| - | return $.trim($(this).html()) == '';
| + | |
| - | }).remove()
| + | |
| - | });
| + | |
| - | </script>
| + | |
| | | | |
| | <style type="text/css"> | | <style type="text/css"> |
| Line 329: |
Line 322: |
| | </style> | | </style> |
| | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> | | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> |
| - | jQuery(document).ready(function($) { | + | |
| - | a=parseFloat(400);// Initial value for the first background (bk 0)
| + | |
| - | b=parseFloat(0);// Initial value for the first background (bk 0)
| + | |
| - | c=parseFloat(400);// Initial value for the second background (bk 1)
| + | |
| - | d=parseFloat(0);// Initial value for the second background (bk 1)
| + | |
| - | var scrollTop = $(window).scrollTop();
| + | |
| - | var scroll_actually= new Array();// Identifies the X and Y values for the background
| + | |
| - |
| + | |
| - | $(window).scroll(function(){//This is not the cleanest way to do this, I'm just keeping it short.
| + | |
| - | if(scrollTop>$(this).scrollTop()) // Scroll up
| + | |
| - | {
| + | |
| - | if (getScrollTop()<=1600 && getScrollTop()>=0)// Identifies the position for the first background when a scroll event occurs
| + | |
| - | {
| + | |
| - | a=a+35;// Position for the first background, it decreases in 35 pixels
| + | |
| - | b=b+10;// Position for the first background, it decreases in 10 pixels
| + | |
| - | $('.img_1').css('backgroundPosition', '50% '+a+'px');
| + | |
| - | $('.bk_0').css('backgroundPosition', '0 '+b+'px');
| + | |
| - | }
| + | |
| - | if (getScrollTop()>=2050 && getScrollTop()<=3650)
| + | |
| - | {
| + | |
| - | c=c+35;// Position for the second background, it decreases in 35 pixels
| + | |
| - | d=d+10;// Position for the second background, it decreases in 10 pixels
| + | |
| - | $('.img_2').css('backgroundPosition', '50% '+c+'px');
| + | |
| - | $('.bk_1').css('backgroundPosition', '0 '+d+'px');
| + | |
| - | }
| + | |
| - | }
| + | |
| - | else
| + | |
| - | {// Scroll down
| + | |
| - | if (getScrollTop()>=0 && getScrollTop()<=1600)
| + | |
| - | {
| + | |
| - | a=a-35;// Position for the first background, it decreases in 35 pixels
| + | |
| - | b=b-10;// Position for the first background, it decreases in 10 pixels
| + | |
| - | $('.img_1').css('backgroundPosition', '50% '+a+'px');
| + | |
| - | $('.bk_0').css('backgroundPosition', '0 '+b+'px');
| + | |
| - | }
| + | |
| - | if (getScrollTop()>=2050 && getScrollTop()<=3650)
| + | |
| - | {
| + | |
| - | c=c-35;// Position for the second background, it decreases in 35 pixels
| + | |
| - | d=d-10;// Position for the second background, it decreases in 10 pixels
| + | |
| - | $('.img_2').css('backgroundPosition', '50% '+c+'px');
| + | |
| - | $('.bk_1').css('backgroundPosition', '0 '+d+'px');
| + | |
| - | }
| + | |
| - | }
| + | |
| - | if (getScrollTop()==0)// Adjusts the positions values and resets them to zero during a scroll up event
| + | |
| - | {
| + | |
| - | a=parseFloat(400);
| + | |
| - | b=parseFloat(0);
| + | |
| - | c=parseFloat(400);
| + | |
| - | d=parseFloat(0);
| + | |
| - | $('.bk_0').css('backgroundPosition', '0 0');
| + | |
| - | $('.bk_1').css('backgroundPosition', '0 0');
| + | |
| - | $('.img_2').css('backgroundPosition', '50% '+400+'px');
| + | |
| - | $('.img_1').css('backgroundPosition', '50% '+400+'px');
| + | |
| - | }
| + | |
| - | scrollTop = $(this).scrollTop();
| + | |
| - | });
| + | |
| - | });
| + | |
| - | function getScrollTop(){ // Verifies the total sum in pixels of the whole page
| + | |
| - |
| + | |
| - | if(typeof pageYOffset!= 'undefined'){
| + | |
| - | // Most browsers
| + | |
| - | return pageYOffset;
| + | |
| - | }
| + | |
| - | else{
| + | |
| - | var B= document.body; //IE 'quirks'
| + | |
| - | var D= document.documentElement; //IE with doctype
| + | |
| - | D= (D.clientHeight)? D: B;
| + | |
| - | return D.scrollTop;
| + | |
| - | }
| + | |
| - | }
| + | |
| - | - See more at: http://www.webdesignshock.com/one-page-website/#sthash.9JiOGphG.dpuf
| + | |
| | </script> | | </script> |
| | </head> | | </head> |
| Line 406: |
Line 329: |
| | <div class="content"> | | <div class="content"> |
| | <h1> Whee </h1> | | <h1> Whee </h1> |
| - | <div class="section bk_0"> | + | <div class="section"> |
| - | <div class="inner img_1"> | + | <div class="inner"> |
| | | | |
| | </div> | | </div> |
| Line 413: |
Line 336: |
| | <div class="constant"> | | <div class="constant"> |
| | </div> | | </div> |
| - | <div class="section bk_1"> | + | <div class="section"> |
| - | <div class="inner img_2"> | + | <div class="inner"> |
| | | | |
| | </div> | | </div> |
"
