2017-07-31 5 views
-1

Le code HTML suivant fonctionne dans Firefox et Google Chrome. Mais, cela ne fonctionne pas avec Internet Explorer 8. Les panneaux ne se développeraient pas (voir le code ci-dessous).Accordéon ne fonctionne pas avec IE8

Y at-il de toute façon que je peux le faire fonctionner avec IE8?

<!DOCTYPE html> 
 
    <html> 
 
    <head> 
 
    <title> 
 
    Test 
 
    </title> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src=" http://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
    <style> 
 
    .custom { 
 
     width: 130px !important; 
 
    } 
 

 
    div.panel { 
 
     display: inline-block; 
 
     background-color: lightblue; 
 
    } 
 
    </style> 
 
    </head> 
 
    <body> 
 
    <div class="accordion" id="myAccordion"> 
 
     <div class="panel"> 
 
     <button type="button" class="btn btn-primary custom" data-toggle="collapse" data-target="#collapsible-1" data-parent="#myAccordion">Section 1</button> 
 
     <div id="collapsible-1" class="collapse"> 
 
     Content 
 
     </div> 
 
     </div> 
 
     <br/> 
 
     <div class="panel"> 
 
     <button type="button" class="btn btn-primary custom" data-toggle="collapse" data-target="#collapsible-2" data-parent="#myAccordion">Section 2</button> 
 
     <div id="collapsible-2" class="collapse"> 
 
     Content 
 
     </div> 
 
     </div> 
 
     <br/> 
 
    </div> 
 
    </body> 
 
    </html>

+0

Vous devez nous faire savoir ce que vous avez essayé. Que se passe-t-il dans IE8? Etc. Soyez plus précis. – Difster

+0

Comme je l'ai mentionné, cela fonctionne avec Firefox et Chrome, mais dans IE8, en cliquant sur un bouton n'ouvrira pas sa cible –

Répondre

0

En effet, la façon dont vous faites cela ne fonctionne pas sur IE. J'ai testé le code directement à partir de jqueryui que vous pouvez trouver here et ça marche pour moi. Vous pouvez également essayer de changer la compatibilité avec <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" /> et essayer des versions différentes, mais je ne pense pas que ce soit la meilleure façon de le faire.

+0

Merci pour la réponse –