I am trying to use Booklet jquery plugin for my project, but the manual and keyboard controls are not working. It seems to be due to this error.
Booklet plugin homepage
Direct link to the js file of the plugin. Error occurs at line 1194.
The error occurs at this particular line :
// manual page turning, check if jQuery UI is loaded
target.find('.b-page').draggable('destroy').removeClass('b-grab b-grabbing');
if(options.manual && $.ui) {
My html:
<!doctype html>
<html>
<head>
<meta charset="UTF-8"/>
<title> asfds </title>
<link rel="stylesheet" type="text/css" media="screen" href="fgerg.css" />
<link href="scripts/jquery.booklet.1.4.0.css" type="text/css" rel="stylesheet" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="scripts/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="scripts/jquery.booklet.1.4.0.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$(function() {
$('#mybook').booklet();
keyboard: true
});
});
</script>
</head>
<body>
<div id="mybook">
<div>
<h3>Yay, Page 1!</h3>
</div>
<div>
<img src="scripts/testmenu1.png" width="100%" height="100%" />
</div>
<div>
<h3>Yay, Page 3!</h3>
</div>
<div>
<h3>Yay, Page 4!</h3>
</div>
<div>
<h3>Yay, Page 5!</h3>
</div>
<div>
<h3>Yay, Page 6!</h3>
</div>
</body>
</div>
</html>
I think draggable comes from JQuery UI, so you will probably need to include it as well.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With