Open sidebar menu effect code based on jquery _jquery

Based on jquery multiple images infinite loop animation effect. This is a very useful jquery multi-image infinite loop animation effect plug-in.

The effect chart is as follows:

Online preview Source Download

HTML code:

<div id= "Paper-back" >
  <nav>
   <div class= "Close" ></div>
   <a href= "#" >home </a>
   <a href= "#" >about us</a>
   <a href= "#" >our the work</a> <a href=
   "#" > contact</a>
  </nav>
 </div>
 <div id= "Paper-window" >
  <div id= " Paper-front ">
   <div class=" Hamburger "><span></span></div>
   <div id=" Container ">
    <section>
     <p> Click on the top left button to open the menu </p>
     <p> Application Browser:, FireFox, Chrome, Safari, Opera, Proud tour, Sogou, the window of the world. <br> does not support IE and the following browsers. </p>
     <p>
     <script src= "/scripts/bc/_gg__.js" type= "Text/javascript" ></script> </p>
    </section>
    <section></section>
   </div>
  </div>
 </div>

JS Code:

var papermenu = {$window: $ (' #paper-window '), $paperFront: $ (' #paper-front '), $hamburger: $ ('. Hamburger '), O
    Ffset:, PageHeight: $ (' #paper-front '). Outerheight (), open:function () {this. $window. addclass (' tilt ');
    this. $hamburger. Off (' click ');
    $ (' #container,. Hamburger '). On (' Click ', This.close.bind (this));
    This.hamburgerfix (TRUE);
   Console.log (' opening ... ');
    }, Close:function () {this. $window. Removeclass (' tilt ');
    $ (' #container,. Hamburger '). Off (' click ');
    this. $hamburger. On (' Click ', This.open.bind (this));
    This.hamburgerfix (FALSE);
   Console.log (' closing ... ');
    }, Updatetransformorigin:function () {scrolltop = this. $window. scrolltop ();
    Equation = (scrolltop + this.offset)/this.pageheight *;
   this. $paperFront. css (' transform-origin ', ' center ' + equation + '% '); }, Hamburgerfix:function (opening) {if (opening) {$ ('. Hamburger '). CSS ({position: ' absolute ', t Op:this. $windoW.scrolltop () + + ' px '});
     } else {settimeout (function () {$ ('. Hamburger '). CSS ({position: ' fixed ', top: ' px '});
    }, );
    }, Bindevents:function () {this. $hamburger. In (' Click ', This.open.bind (this));
    $ ('. Close '). In (' Click ', This.close.bind (this));
   this. $window. In (' Scroll ', This.updateTransformOrigin.bind (this));
    }, Init:function () {this.bindevents ();
   This.updatetransformorigin ();
  }
  };
 Papermenu.init ();