Hi folks …
My tribute page has a toggle so that menu when the screen gets small the menu becomes a button.
This functionality requires jquery.
When I am online this script takes care of this:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
However, most of the work I do is offline.
So, I downloaded jquery-1.12.4 into the same folder as my project.
Then I added the following script to my <head>
:
<script src="jquery-1.12.4/jquery.min.js"></script>
However, the menu-toggle is does not work?
This is driving me nuts! Any ideas folks?
Did you place the jQuery file in a folder called jquery-1.12.4
?
Is the src location correct? Try an extra leading / or try the absolute file path.
yes …
the actual html file path is:
portfolio/my portfolio.html
the jquery file path is:
portfolio/jquery-1.12.4/jquery.min.js
Are you sure jQuery works? Try a simple script that uses jQuery, like
$("something").click(function() {
alert("Hi");
});
Since you mentioned a menu-toggle, I assume you’re using Bootstrap. Have you downloaded Bootstrap.js?
1 Like
Have you tried this file path:
<script src="/jquery-1.12.4/jquery.min.js"></script>
(Note the leading /)
2 Likes
Hi guys … Problem solved!
Swapped the order of two lines of code:
Toggle does not work:
<script src="jquery-1.12.4/jquery.min.js"></script>
<script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>
Toggle does work:
<script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="jquery-1.12.4/jquery.min.js"></script>
Bizarre but true! (any idea why this is so?)
Thank you so much … thanks a lot for your suggestions, and i really appreciate the speed with which you replied - it’s really reassuring to know that when i get stuck there’s people who will help out.
All the best - Paul.
Thanks @JacksonBates
Thanks @kevcomedia
1 Like
paulrishworth:
Swapped the order of two lines of code:
Toggle does not work:
<script src="jquery-1.12.4/jquery.min.js"></script>
<script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>
Toggle does work:
<script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="jquery-1.12.4/jquery.min.js"></script>
Bizarre but true! (any idea why this is so?)
Isn’t it the other way around?
Bootstrap.js depends on jQuery, so jQuery has to be loaded first.
FYI I keep editing your posts so the code shows. The forum doesn’t accept raw HTML, so you need to use back ticks to format code:
This post is modeled on http://forum.freecodecamp.com/t/markdown-code-formatting/18391, but modified for the slight differences between the Forum and Gitter. If you are interested in using Spoiler blocks, check this post: Spoilers. You can post code...
Reading time: 2 mins 🕑
Likes: 42 ❤
1 Like
Ooops! You are right. This is the version that works - jquery before js:
<link rel="stylesheet" href="bootstrap-3.3.7/css/bootstrap.min.css">
<script src="jquery-1.12.4/jquery.min.js"></script>
<script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>
(Thanks for the formatting tip.)
Yepp!!!
should just follow the order as clearly mentioned in the cdn files on bootstrap sites.
Though it should be order free