bootstrap3のデザインでCakePHP使うってことで、BoostCake環境を作りました。
Webアプリを作り始めたんだけど… 静的なHTMLとbootstrap3とjqueryではできていた次の2点が動かないよー。困った。
1） responsibleデザインのcollapseが効かない
静的に作ってた時はぺろっとメニューがドロップダウンしたんだけど、うんともすんとも言わなくなった。
2） モーダルダイアログが表示されない
静的な環境では出るんだが・・・
さて、原因追求して直すか別の画面仕様にするか。
結局 BoostCakeやらbootstrap.js と jquery.js のバージョンの相性のようでした。
bootstrap.min.300.js
jquery.js
bootstrap.min.css
これらのファイルをjsはapp/webroot/jsディレクトリに、cssはapp/webroot/cssディレクトリに配置し、下記のような順番で読み込んだらOKでした。
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- jequery の次に bootstrap.min.300 をロード。順番まもること -->
<?php echo $this->Html->css('bootstrap.min'); ?>
<?php echo $this->Html->script('jquery'); ?>
<?php echo $this->Html->script('bootstrap.min.300'); ?>
<title>Proto01</title>
</head>
<head>内に書くとうまくいくのですが、<body>の最後の方に書くとうまく動きませんでした。
0 件のコメント:
コメントを投稿