Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
However, the argument for using a CDN is, other people may have linked their websites to this same jQuery file, so it may already be downloaded and cached on somebody's computer. And if that's the case, then your website loads that much faster, because one very large element of your website is already downloaded and cached on your computer. The downside to that is if the CDN is off-line, then it's not serving up a copy of jquery. And so your website's not getting a copy of J Query. But that happens very rarely.
So I wouldn't worry terribly much about that. JQuery comes in two versions. There is the 1.0 version, and the 2.0 version. Based on browser support, I'm going to recommend they use JQuery one version. . Because this is going to support Internet Explorer 8, which I know is a concern for a lot of you still. Bootstrap itself, remember, supports Internet Explorer 9 & 10, it can support Internet Explorer 8, with the addition of respond.js which I'm going to walk you through how to add that in just a minute. JQuery 2.0 works with Internet Explorer nine and ten as well.
Now many of you are probably wondering why I did not put this line of code in the head of my document, because we are usually trained to put java script in the head of the document. The reason why is, as you put lots of files in the head of your document, it's important that their there if they're required for loading the webpage in the way its going to display. Like your style sheets for example, but in this case JQery is responsible for functionality on the page. When you put it in the head of the document, we have to wait for it to download before we can see the rest of the webpage. Which means that it may feel like your website loads quite a bit more slowly.
By putting your JQuery down here in the footer of the document, all of the other information on the page can load first before JQuery loads. Feels like your website is going faster. Because at least something is displaying on the page that you can read while you're waiting for the functionality to load. So that's why we're putting jQuery down here on the bottom. The other thing we're going to add is a link to Bootstraps Java script. So we're going to add that as well. So that's our script tag again. With the source of JS slash Bootstrap.min.js and slash script.
So if you will open up your web browser again And I've given you the URL. It's right here in that additional head code document. I'm just going to copy that URL, and paste it right here into my web browser. And, you'll see here, that we have this copy of respond dot js right here. And what we're going to do is we're going to download this copy of respond dot min dot JS. There's a bunch of stuff here. You can download all of it if you wish, but all we really need is this one file. If you click on the name of that one file, this is going to give you everything you need right here.
It is of course a minified file. And then, according to the instructions that are here on the website, hit my back button here. You go down and read through the instructions here, it tells you exactly what you needed to do and where exactly you need to put this particular file in order for it to work. So I am going to go ahead and add a link to respond.js in the head of the document, because that's what the instructions say. So I'm going to add a script here, src equals js/respond.js slash script.
And now you're reading to start building a Bootstrap website.
Get unlimited access to all courses for just $25/month.Become a member
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.