2016-05-17 14 views
0

私のモジュールがロードされない理由をご覧ください。モジュールが下にロードされます。私が最後の3列目でそれを呼び出すとき。私はこのコードをテストするとき、それは動作しません。何がうまくいかなかったかを私に教えてもらえますか?ありがとうございました。私のブートストラップモジュールはロードされません

ステファン

my bootstrap folder structure

<!DOCTYPE html> 
<html> 
    <head> 
    <link href='https://fonts.googleapis.com/css?family=Lato:100,300' rel='stylesheet' type='text/css'> 
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"> 
    <link rel="stylesheet" href="css/style.css"> 
    <script type="text/javascript" src="bootstrap/js/jquery.js"></script> 
    <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script> 
    </head> 
<body> 

<div class="container"> 
<div class="row"> 
    <div class="col-md-6"> 
     <img class="title-logo" src="http://placehold.it/100x100"></div> 
<div class="col-md-6 text-right text-uppercase"> 
<h1 class="title-super text-thin">Stefan Schwarzer</h1> 
<h3>Front-end Ninja</h3> 
</div> 
</div> 
<div class="row"> 
<div class="col-md-12"> 
    <hr> 
<img class="img-responsive" src="images/2_1140x350.png"> 
</div> 
</div> 
<div class="row"> 
<div class="col-md-12"> 
<h2 class="text-muted">Featured Work</h2> 
    </div> 
</div> 
<div class="row text-center"> 
    <div class="col-md-4"> 
     <img class="img-responsive" src="images/1_350x150.png" data-toggle="modal" data-target="project1"> 
     <h3 clss="text-uppercase">Javascript Project</h3> 
     <p><a href="http://github.com">Link to project</a></p> 
    </div> 
    <div class="col-md-4"> 
     <img class="img-responsive" src="images/2_350x150.png"> 
     <h3 clss="text-uppercase">my Hobbies</h3> 
     <p><a href="http://github.com">my Hobbies</a></p> 
    </div> 
    <div class="col-md-4"> 
     <img class="img-responsive" src="http://placehold.it/350x150"> 
     <h3 clss="text-uppercase">my Work</h3> 
     <p><a href="http://github.com"></a>my Work</p> 
    </div> 
</div> 
</div> 
</div> 

<!-- Button trigger modal --> 
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
    Launch demo modal 
</button> 

<!-- Modal --> 
<div class="modal fade" id="project1" 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">Javascript Project</h4> 
     </div> 
     <div class="modal-body"> 
     hello how are you 
     ... 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div> 
    </div> 
</div> 

</body> 
</html> 

答えて

0

はここであなたが使用して、ライブラリの現在のディレクトリを指定する必要があり

<button type="button" class="btn register-now btn-lg" data-toggle="modal" data-target="#register">Save changes</button> 

    <div id="register" class="modal fade"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <div class="modal-header register-now"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
         <span aria-hidden="true">&times;</span> 
        </button> 
        <h4 class="modal-title">Save Changes here</h4> 
       </div> 
       <div class="modal-body"> 
       hello how are you 
        ... 
       </div> 
      </div><!-- /.modal-content --> 
     </div><!-- /.modal-dialog --> 
    </div><!-- /.modal --> 
+0

私はそれを変更する必要があるモーダルだとは思わない。 –

0

コーディング幸せ、動作するバージョンだ "./"

<link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css"> 
<link rel="stylesheet" href="./css/style.css"> 
<script type="text/javascript" src="./bootstrap/js/jquery.min.js"></script> 
<script type="text/javascript" src="./bootstrap/js/bootstrap.min.js"> 
+0

ありがとうございます。 ./を追加しましたが、まだモジュールをロードしません。ボタンがポップアップしますが、クリックすると何も起こりません。 –

+0

ああ、私はあなたのjqueryスクリプトのための小さなマイナーな詳細を逃した。新しい答えを見る – phamous

関連する問題