correctly reference jquery mobile locally

0
votes

user3568918 has responded to the following question:

jQuery Mobile not working with Internet Explorer?

Dont forget to keep the right binding Order:

  • jquery mobile css
  • jquery script
  • jquery mobile script

My question is :

When I go to download page of jquery mobile https:/ /jquerymobile.com/download/ I see two viable options for me :

  1. Download the javascript, css and images :

https:/ /jquerymobile.com/resources/download/jquery.mobile-1.4.5.zip

  1. Download the minified javascript :

http:/ /code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js

If I choose 1, two additional subfolders "demos" and "images" are created, which have their own sub-folders. Do I have to reference all these subfolders in my html ?

If I choose 2, which is to download the minified javascript only, how do I reference the images that I want to use for icons?

Thanks a lot in advance.

1
jquery-mobile

1 Answers

0
votes

Example: assuming your index.html is the root, you should reference:

<link rel="stylesheet" href="css/jquery.mobile.1.4.5.min.css" />

<script src="js/jquery-1.11.2.min.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>

Then, the directory structure on your server shall be like this:

\index.html

-- All jQuery files shall be in \js subfolder and \css subfolder

\js\
----jquery-1.11.2.min.js
----jquery-1.11.2.min.map
----jquery.mobile-1.4.5.min.js
----jquery.mobile-1.4.5.min.map
(...other stuff)

\css\
-----jquery.mobile-1.4.5.min.css
-----jquery.mobile.external-png-1.4.5.min.css
-----jquery.mobile.icons-1.4.5.min.css
-----jquery.mobile.inline-png-1.4.5.min.css
-----jquery.mobile.inline-svg-1.4.5.min.css
(...other stuff)

\css\images\
------------ajax-loader.gif
------------icons-18-black.png
------------icons-18-white.png
(...other stuff)

\css\images\icons-png\
----------------------action-black.png
----------------------action-white.png
(...a lot of other stuff)

\css\images\icons-svg\
----------------------action-black.svg
----------------------action-white.svg
(...a lot of other stuff)

EDIT:

subfolders demos and images inside the zip file are ready for you if you need to have the JQM demos also available on your local site, there is also a custom css file special for the demos.

I think this will also clarify some aspect of your question: https://css-tricks.com/data-uris/