JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://builtbywill.com/code/booklet/src/jquery.easing.1.3.js"></script>
<div id="custom-menu"></div>
<div id="mybook">
    <div title="This is a page title"> 
        <h3>Yay, Page 1!</h3>
    </div>
    <div> 
        <h3>Yay, Page 2!</h3>
    </div>
    <div title="This is another title"> 
        <h3>Yay, Page 3!</h3>
    </div>
    <div> 
        <h3>Yay, Page 4!</h3>
    </div>
    <div title="Hooray for titles!"> 
        <h3>Yay, Page 5!</h3>
    </div>
    <div> 
        <h3>Yay, Page 6!</h3>
    </div>
</div>

CSS

.booklet         {width:800px; height:600px; position:relative; margin:0 auto 10px; overflow:visible !important;}
	.booklet .b-page {left:0; top:0; position:absolute; overflow:hidden; padding:0; outline:1px solid transparent;}
	
	.booklet .b-pN  {}
	.booklet .b-p0  {}
	.booklet .b-p1  {}
	.booklet .b-p2  {}    
	.booklet .b-p3  {}
	.booklet .b-p4  {}
	   
   	/* Page Wrappers */
	.booklet .b-wrap       {top:0; position:absolute;}
	.booklet .b-wrap-left  {background:#fff;}
	.booklet .b-wrap-right {background:#efefef;}
	
	.booklet .b-pN .b-wrap,
	.booklet .b-p1 .b-wrap,
	.booklet .b-p2 .b-wrap,
	.booklet .b-p3 .b-wrap,
	.booklet .b-p4 .b-wrap  {left:0;}
	.booklet .b-p0 .b-wrap  {right:0;}
	
   	/* Custom Page Types */
	.booklet .b-page-blank  {padding:0; width:100%; height:100%;}
	.booklet .b-page-cover  {padding:0; width:100%; height:100%; background:#925C0E;}
	.booklet .b-page-cover h3  {color:#fff; text-shadow:0px 1px 3px #222;}
   
   	/* Page Numbers */
	.booklet .b-counter {bottom:10px; position:absolute; display:block; width:25px; height:20px; background:#ccc; color:#444; text-align:center; font-family:Georgia, "Times New Roman", Times, serif; font-size:10px; padding:5px 0 0;}
	.booklet .b-wrap-left  .b-counter  {left:10px;}
	.booklet .b-wrap-right .b-counter {right:10px;}
   
   	/* Page Shadows */
	.booklet .b-shadow-f  {right:0; top:0; position:absolute; opacity:0; background-image:url("images/shadow-top-forward.png"); background-repeat:repeat-y; background-position:100% 0;}
	.booklet .b-shadow-b  {left:0;  top:0; position:absolute; opacity:0; background-image:url("images/shadow-top-back.png");    background-repeat:repeat-y; background-position:0 0;}
	
	.booklet .b-p0 {background-image:url("images/shadow.png"); background-repeat:repeat-y; background-position:100% 10px;}
	.booklet .b-p3 {background-image:url("images/shadow.png"); background-repeat:repeat-y; background-position:0 10px;}
	
   	/* Overlay Controls */
	.booklet .b-grab     {cursor:...

JavaScript

(function ($) {

    $.fn.booklet = function (options, param1, param2) {

        var obj, method, params, output, result, config, index;

        // option type string - api call
        if(typeof options === 'string') {
            result = new Array();
            $(this).each(function(){
                obj = $(this).data('booklet');
                if(obj) {
                    method = options;
                    // add optional parameters
                    params = new Array();
                    if(param1) {
                        params.push(param1);
                    }
                    if(param2) {
                        params.push(param2);
                    }
                    if(obj[method]) {
                        output = obj[method].apply(obj, params);
                        if(typeof output !== 'undefined' || output){
                            result.push(obj[method].apply(obj, params));
                        }
                    } else {
                        $.error('Method "' +  method + '" does not exist on jQuery.booklet.');
                    }
                } else {
                    $.error('jQuery.booklet has not been initialized. Method "'+options+'" cannot be called.');
                }
            });
            if(result.length == 1){
                return result[0];
            } else if (result.length > 0) {
                return result;
            } else {
                return $(this);
            }
        }
        // option type number - api call
        else if(typeof options === 'number') {
            return $(this).each(function(){
                obj = $(this).data('booklet');
                if(obj) {
                    index = options;
                    obj.gotopage(index);
                } else {
                    $.error('jQuery.booklet has not been initialized.');
                }
            });
        }
        // else build new booklet
        else if (typeof method ===...