CODEWITHSUNDEEP
jquerytwitter-bootstrapcarouselaccordion
user6542823
user6542823

Reputation: 1476

Bootstrap.js before jQuery.js

On my page I have jQuery accordion and a Bootstrap carousel. I am including jQuery.js before bootstrap.js. In this case, the accordion won't work.

If I use bootstrap.js before jQuery.js, the accordion will work but then the carousel won't work (which is due to the fact that jQuery isn't loaded).

I have already looked at: Bootstrap.js has to load before jQuery But this is not the case with me.

As I understand, loading jQuery.js before bootstrap.js is the correct choice but then how would I make the accordion work?

Upvotes: 0

Views: 3965

Answers (1)

Abdennour TOUMI
Abdennour TOUMI

Reputation: 93173

There is two jquery libraries :

1. Core

2. UI

Thus , the order is :

  1. Load jquery.min.js (core)

Then :

  1. Import bootstrap.min.js (Where you have Carousel)

Then ,

  1. jquery.ui.js (UI) (Where you have accordion)

Anyway, we recommend to wrap all your code when document is ready :

 $(function(){

     // All your code here
   
 })

Try this and tell us :

    <link rel="stylesheet" href="https://code.jquery.com/ui/jquery-ui-git.css" media="screen" title="no title" charset="utf-8">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" media="screen" title="no title" charset="utf-8">


   <script src="https://code.jquery.com/jquery-2.2.1.min.js"
              integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="
              crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/javascript"></script>
    <script  src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"
              integrity="sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E="
              crossorigin="anonymous"></script>

Upvotes: 2

Related Questions