Forum : JavaScript/Bootstrap

Salut,
je suis entrain de m'exercer avec le bootstrap et je viens de me heurter contre un problème avec le JavaScript surtout dans la partie consacrée à ce dernier.

En fait, dans cette partie il y a certaines animations comme modal qui peuvent rendre la page attirante, en cliquant sur un bouton, on peut voir certaines informations cachées! Le grand problème est que ça ne marche pas chez moi, même après avoir inclu le fichier modal.js ça ne marche toujours pas.

Je compte pour vous pour palier à ce problème.

Merci d'avance!!!!!!

Huggy

Réponse acceptée

Il se peut que modal.js soit déjà inclus dans bootstrap, essayes en l'enlevant
la version de jquery a aussi son importance > 2.0 pour les dernières versions (en général on a un message dans la console)

kwik

Salut

Question toute bête as tu charger jquery avant de charger le javascript de bootstrap ?

Matho13

Auteur

Oui, je le fais

Muxabble

Tu as verifier que tes fichiers sont accessibles?

Matho13

Auteur

Oui mon cher

Muxabble

colle nous ton index.html

Matho13

Auteur

Le voici

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="css/bootstrap.min.css" media="screen" title="no title" charset="utf-8">
    <title>Mon site</title>
  </head>
  <body>
    <div class="container">
      <!-- Voici le bouton auquel je veux cliquer -->

      <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
          Voir plus
      </button>

     <!-- Pour afficher ceci -->

     <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Matho</h4>
          </div>
          <div class="modal-body">
            <p>
              Passionné par le web depuis quelques années, j'aimerai aussi partager cette passion avec mes amis
            </p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Quitter</button>
            <button type="button" class="btn btn-primary">J'aime</button>
          </div>
        </div>
      </div>
    </div>

    </div>  
  </body>
  <script type="text/javascript" src="js/jquery"></script>
  <script type="text/javascript" src="js/bootstrap.min.js"></script>
  <script type="text/javascript" src="js/modal.js"></script>
</html>

Muxabble

Bah il manque le .js a to nfichier jQuery ... Logiquement ça ne peut pas fonctionner :)

Matho13

Auteur

C'etait pas le problème de jquery mais c'était le problème avec modal.js apparamment il ne faut pas l'inclure comme l'a precisé Huggy.
Merci à vous tous

Muxabble

Non mais si tu a copier coller tels quels ton fichier html ton jQuery n'est pas charger vu que tu as oublier de lui mettre l'extension ...

// Ta version
<script type="text/javascript" src="js/jquery"></script>
// Version rectifiée
<script type="text/javascript" src="js/jquery.js"></script>

JavaScript/Bootstrap

10 réponses