ページをめくるプラグインturn.js

正直に言って、ページをめくってturn.jsの中の穴がとても多くて、その時のプロジェクトの中で何日間踏んでも踏みきれないことを覚えています.個人的には慎重にご利用ください.
簡単な入門を紹介します.
1.ファイル部分を導入する(jQを導入しないといけないので、turn.jsファイルはインターネットで探すことができます.modenizrもturn.jsの一部です.)

＜div style=「line-height:1.75;font-size:14 px;」
＜script type=「text/javascript」src=「js/modenizr.3.3.min.js」/>

＜div style=「line-height:1.75;font-size:14 px;」
＜script type=「text/javascript」src=「js/turn.js」/>

＜div style=「line-height:1.75;font-size:14 px;」



＜span style=「justify」2.
＜span style=「font-size:22 px;カラー:rgb(223,64,42)」注意:
＜span style=「カラー:rgb(223,64,42)、font-size:22 px;」は背景色または背景画像を設定しなければならない.そうでないと透明に他のpage(/span)が見られます.

html部分:

			

				
1 1 
				
 2 2 
				
 3 3 
				
 4 4 
			

＜div style=「line-height:1.75;font-size:14 px;」
＜span style=「font-size:22 px;」>3.セットturn.js

function loadLook(){
	var innerWidth = $(window).width();
	var innerHeight = $(window).height();
    function loadApp() {
      $('.flipbook').turn({
          width:innerWidth,//  
          height:innerHeight,//  
          display:"single",//      。 ： ， 
          elevation: 50,
          pages:4,//  
          page:1,//    
          gradients: true,
          autoCenter: true,
	 //when       
          /*when:{
            turning: function(e, page, view){
              var book = $(this),
              currentPage = book.turn('page'),
              pages = book.turn('pages');
            }
          }*/
      });
    }
    // Load the HTML4 version if there's not CSS transform
    yepnope({
      test : Modernizr.csstransforms,
      yep: ['js/turn.js'],
      both: ['css/basic.css'],
      complete: loadApp
    });
  }

loadLook();

 //     
  $("#help").on("click",function(event) {
    $(".flipbook").turn("next");
  });
  //     
  $("#help").on("click",function(event) {
    $(".flipbook").turn("previous");
  });