All geek questions in one place

Bootstrap accordian does not work with IE

I am working on a site using bootstrap, I used the Collapse function of JavaScript.

It works with all browsers except IE.

http://bonanza.mocorner.com/en/success_story/

The above URL, if you use FF or Chrome, you can see that the accordion is working fine. When using IE it is not, any ideas? although in my HTML header I included the following

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements --> <!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]-->

Below is my HTML code

 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" > <head> <meta charset="utf-8"> <!-- CSS Styling starts here --> <link rel="stylesheet" type="text/css" href="/public_assets/bootstrap/css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="/public_assets/bootstrap/css/bootstrap-responsive.min.css" /> <link rel="stylesheet" type="text/css" href="/public_assets/base.css" /> <!-- CSS Styling ends here --> <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements --> <!--[if lt IE 9]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <!-- JS Starts here --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> <script type="text/javascript" src="/public_assets/bootstrap/js/bootstrap.min.js"></script> <script type="text/javascript" src="/en/js/common_js.js"></script> <script type="text/javascript" src="/public_assets/js/jquery.cookie.js"></script> <!-- JS ends here --> </head> <body> .............. <script> $(".collapse").collapse(); </script> <div class="collapse in"> <div id="accordion-group" class="accordion"> <div class="accordion-group"> <div class="accordion-heading"> <a href="#collapse-2" data-parent="#accordion-group" data-toggle="collapse" class="accordion-toggle"> Checking Story (published on Sept. 30, 2012, 1:43 pm) </a> </div> <div class="accordion-body collapse" id="collapse-2" style="height: 0px;"> <div class="accordion-inner"> <p><img src="/public_media/success_story/2012/09/30/happyFamily.jpg" class="img-rounded" style="float: left; margin-right: 5px;" /> Checking Story...</p> </div> </div> </div> <div class="accordion-group"> <div class="accordion-heading"> <a href="#collapse-1" data-parent="#accordion-group" data-toggle="collapse" class="accordion-toggle"> The story of our lives (published on Sept. 30, 2012, 10:20 am) </a> </div> <div class="accordion-body collapse" id="collapse-1" style="height: 0px;"> <div class="accordion-inner"> <p><img src="/public_media/success_story/2012/09/30/promo_bts.jpg" class="img-rounded" style="float: left; margin-right: 5px;" /> The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives The story of our lives.</p> </div> </div> </div> </div> </div> </div> </div> </div> </body> </html>
+4
source share
1 answer

This is a 2.1.0 error, which is resolved in 2.1.1 - you should update the Bootstrap files.

+6
source

Source: https://habr.com/ru/post/1437118/

More articles:


All Articles