Geek asks and answers

Uncaught TypeError: Object [object Object] does not have a drag and drop method. (Jquery plugin for booklet)

I am trying to use the jQuery plugin for my project, but the manual and keyboard controls do not work. This is due to this error.

Broker Plugin Homepage

Direct link to the js file of the plugin. The error occurs on line 1194.

An error occurs on 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>
+5
source share
2 answers

I think draggable comes from the jQuery UI , so you probably also need to enable it.

+21
source 
 $(function() {
                $('#mybook').booklet( {keyboard: true} ); 

            });

put the "keyboard: true" function inside the booklet () to get the parameters

0
source

More articles:


All Articles