Bootstrap 4 - JQuery Accordion не работает - PullRequest
Новая
       42

Bootstrap 4 - JQuery Accordion не работает

1 голос
/ 14 октября 2019

Этот аккордеон был создан с использованием Bootstrap-4 и jQuery-3.2.1. При нажатии на плюс, минус символы, я перехожу наверх веб-страницы. Также первый раздел не расширен. Это мой кодя включил голову, раздел с аккордеоном и библиотеки javascript, включенные в веб-страницу. 

  <!-- Bootstrap CSS File -->
  <link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!-- Libraries CSS Files -->
  <link href="lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
  <link href="lib/animate/animate.min.css" rel="stylesheet">
  <link href="css/style.css" rel="stylesheet">


<section id="portfolio">
      <div class="container wow fadeIn">
        <div class="section-header">
          <h3 class="section-title">FAQ</h3>
          <p class="section-description"></p>
        </div>
        <div class="row">
        <div class="col-lg-12">
            <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                <div class="panel panel-default">
                    <div class="panel-heading" role="tab" id="headingOne">
                        <h4 class="panel-title">
                            <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                Q: If Your Main Aim Is To Help People And Fulfill A Spiritual Purpose, Why Do You Charge A Fee For It?
                            </a>
                        </h4>
                    </div>
                    <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
                        <div class="panel-body">
                            <p>A: We like to see it as a donation towards maintaining our website, servers and other necessities. Besides this, the members of our team spend a lot of time traveling, and a number of medicinal items are required for our procedures.
It is due to spiritual reasons that we provide refunds through our website without any questions or doubt if we ever fail to help you because it does not feel right to us to ask for something in return in we couldn’t deliver. If we fail, all the making and courier charges are also borne by us, though we are unlikely to be unsuccessful. This proves the amount of faith we have in our work.</p>
                        </div>
                    </div>
                </div>
                <div class="panel panel-default">
                    <div class="panel-heading" role="tab" id="headingTwo">
                        <h4 class="panel-title">
                            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                Q: How Do You Spend The Money Earned From This Website?
                            </a>
                        </h4>
                    </div>
                    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                        <div class="panel-body">
                            <p>A: A part of the money earned is directed towards maintenance and development, including travel, translation, food, stay, etc. The rest of it is spent on our livelihood so that we contribute more time towards this cause. Also, a part of our earnings is also donated to the needy in the form of food. </p>
                        </div>
                    </div>
                </div>
                <div class="panel panel-default">
                    <div class="panel-heading" role="tab" id="headingThree">
                        <h4 class="panel-title">
                            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                Q: You Are Able To Help A Few But How Are You Planning To Help Those Who Are Suffering From Illnesses But Have No Access To The Internet? Also, What Is Your Take On Incurable Diseases Or Diseases Which Are Not Mentioned Here?
                            </a>
                        </h4>
                    </div>
                    <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                        <div class="panel-body">
                            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent nisl lorem, dictum id pellentesque at, vestibulum ut arcu. Curabitur erat libero, egestas eu tincidunt ac, rutrum ac justo. Vivamus condimentum laoreet lectus, blandit posuere tortor aliquam vitae. Curabitur molestie eros. </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

      </div>
    </section>
<script src="lib/jquery/jquery.min.js"></script>
<script src="lib/jquery/jquery-migrate.min.js"></script>
<script src="lib/bootstrap/js/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
...