jQuery Mobile加载错误

Question

I am trying to make a mobile application using jQuery. I am using to make a swipe panel and i have a source for it. The sources are .html .css and .js the html and css seem to work but the .js does not. Any answers?

Its suppose to look like this this

Also its on my local web server.

Source Code:

.js

$(document).on("pageinit", "#demo-page", function () {
  $(document).on("swipeleft swiperight", "#demo-page", function (e) {
// We check if there is no open panel on the page because otherwise
// a swipe to close the left panel would also open the right panel (and v.v.).
// We do this by checking the data that the framework stores on the page element (panel: open).
    if ($.mobile.activePage.jqmData("panel") !== "open") {
      if (e.type === "swipeleft") {
        $("#right-panel").panel("open");
      }
      else if (e.type === "swiperight") {
        $("#left-panel").panel("open");
      }
    }
  });
});

Answer 1

You need to load your JS files in this order:

<script src="jquery.js"></script>
<script src="custom-scripting.js"></script>
<script src="jquery-mobile.js"></script>

reference: http://jquerymobile.com/demos/1.0/docs/api/globalconfig.html