jQuery UI draggable is not a function Error
Why function draggable works in Chrome and does not work Safari?
gems.js
- $(document).ready(function(draggable) {
- $('.draggable').draggable();
- });
index.html
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
- <title></title>
- <link href="lib/ionic/css/ionic.css" rel="stylesheet">
- <link href="css/style.css" rel="stylesheet">
- <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
- <script src="lib/ionic/js/ionic.bundle.js"></script>
- <script src="cordova.js"></script>
- <script src="js/app.js"></script>
- <script type="text/javascript" src="js/jquery-2.2.3.min.js"></script>
- <script src="js/jquery-1.11.1.min.js"></script>
- <script type="text/javascript" src="js/jquery.mobile-1.4.5.min.js"></script>
- <script type="text/javascript" src="js/jquery.dice.js"></script>
- <script type="text/javascript" src="js/dice.js"></script>
- <script type="text/javascript" src="js/gems.js"></script>
- <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
- </head>
- <body ng-app="starter">
- <ion-pane>
- <ion-header-bar class="bar-dark">
- <h1 class="title">#sanskritGame</h1>
- </ion-header-bar>
- <ion-content>
- <div data-role="collapsibleset" data-theme="b">
- <div data-role="collapsible" data-collapsed-icon="carat-d" data-expanded-icon="carat-u" data-iconpos="right" data-collapsed="false" align="center">
- <h3>Поле Игры</h3>          <img src="img/gameSquare.png" style="max-width: 100%; height: auto;" class="fullscreen">
- <table id="tableGems">
- <tr>
- <td>
- <div id="drag1" class="draggable">
- <img class="gems" src="img/ruby.png" alt="1">
- </div>
- </td>
- <td>
- <div id="drag2" class="draggable">
- <img class="gems" src="img/orange.png" alt="2">
- </div>
- </td>
- <td>
- <div id="drag3" class="draggable">
- <img class="gems" src="img/green.png" alt="3">
- </div>
- </td>
- <td>
- <div id="drag4" class="draggable">
- <img class="gems" src="img/blue.png" alt="4">
- </div>
- </td>
- <td>
- <div id="drag5" class="draggable">
- <img class="gems" src="img/almaz.png" alt="5">
- </div>
- </td>
- <td>
- <div id="drag6" class="draggable">
- <img class="gems" src="img/brilliant.png" alt="6">
- </div>
- </td>
- </tr>
- </table>
- </div>
- <br>
- <div id="dice"></div>
- <br>
- </div>
- </ion-content>
- </ion-pane>
- </body>
- </html>