最初の投稿。私はかなり長い間私の役割のマイナーな部分として設計されていて、CSSテンプレートを余分に使うことに頼っています。私がどこにいるのかをあなたに知らせるだけです。私は最近、「ミニメニュー」(ページの幅が狭いときのみを表示するドロップダウンナビゲーションメニュー)を含むテンプレートを利用しました。何らかの理由で、ナビゲーションが機能していません。リスト内のページを選択すると、ページに移動しません。これはおそらく本物の初心者の質問ですが、私はコードを試してみましたが、私の人生にとってはそれも効くことができません。JQueryミニメニュー - ナビゲーションが機能していません
以下は私の持つHTMLです。どんな提案も非常に高く評価されます。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<title>Capita - BIM Level 2 Training</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/component.css">
<link rel="stylesheet" href="css/custom-styles.css">
<link rel="stylesheet" href="css/font-awesome.css">
\t
\t <link rel="stylesheet" href="css/demo.css">
<link rel="stylesheet" href="css/font-awesome-ie7.css">
\t
<script src="js/jquery.mobilemenu.js"></script>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<script>
$(document).ready(function(){
$('.menu').mobileMenu();
});
</script>
</head>
<body>
<div class="header-wrapper">
<div class="site-name">
<a href="index.html"><p><img src="img/CapitaBanner.jpg" alt="" class="img-responsive"></a>
\t \t <h1>BIM Level 2 Training</h1>
<h2>This training is for internal use only</h2>
</div>
</div>
<div class="menu">
<div class="navbar">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<i class="fw-icon-th-list"></i>
</button>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="index.html">Home</a></li>
<li><a href="#">Modules</a></li>
<li><a href="#">BIM4Capita</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</div>
<div class="mini-menu">
<label>
<select class="selectnav">
<option value="#" selected="">Home</option>
<option value="#">About</option>
<option value="#">→ Another action</option>
<option value="#">→ Something else here</option>
<option value="#">→ Another action</option>
<option value="#">→ Something else here</option>
<option value="#">Services</option>
<option value="#">Work</option>
<option value="#">Contact</option>
</select>
</label>
</div>
</div>
</div>
<div class="container">
<div class="featured-block">
<!-- Example row of columns -->
<div class="row">
<div class="col-md-3">
<div class="block">
<div class="thumbnail">
<a href="WhatIsBIM.html"><img src="img/img1.jpg" alt="" class="img-responsive"></a>
<div class="caption">
<h1>What is BIM?</h1>
<p>In this module we will explore what BIM is, what BIM level 2 is and what it is not.<br><br></p>
<a class="btn" href="whatisbim.html">more</a>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="block">
<div class="thumbnail">
<img src="img/img2.jpg" alt="" class="img-responsive">
<div class="caption">
<h1>Benefits of BIM</h1>
<p>In this module we will explore the benefits of BIM when it is deployed fully on a project for both Capita and our client.</p>
<a class="btn" href="#">more</a>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="block">
<div class="thumbnail">
<a href="BIMTech.html"><img src="img/img3.jpg" alt="" class="img-responsive"></a>
<div class="caption">
<h1>BIM Technology</h1>
<p>In this module we explore some of the technologies available to achieve the BIM Benefits.<br><br></p>
<a class="btn" href="BIMTech.html">more</a>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="block">
<div class="thumbnail">
<img src="img/img4.jpg" alt="" class="img-responsive">
<div class="caption">
<h1>BIM Workflow</h1>
<p>In this modules we explore the changes to project workflow that arise from implementing BIM.<br><br></p>
<a class="btn" href="#">more</a>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="block">
<div class="thumbnail">
<img src="img/img9.jpg" alt="" class="img-responsive">
<div class="caption">
<h1>Capita Examples</h1>
<p>In this module we review examples of projects within Capita that have already used the BIM process.<br><br></p>
<a class="btn" href="#">more</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="js/jquery-1.9.1.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/modernizr-2.6.2-respond-1.1.0.mi
</body>
</html>
JSフォルダは、
- bootstrap.js
- html5shiv.js
- jqueryの - 1.9.1.js
- modernizr-2.6が含まれています。 2応答-1.1.0.min.js
- respond.min.js
Google ChromeでInspectを使用すると、次のエラーが発生します。
- リソースの読み込みに失敗しました:28キャッチされないにReferenceError:$はindex.htmlをで 定義されていない:28 /favicon.icoサーバが(見つかりません)404
- たindex.htmlの状態で応答し
- は、リソースの読み込みに失敗しました:サーバーは、404の状態(見つかりません)
おかげニコは、本当にあなたが何を「コンソール」 わからない時間を割いて感謝? ライブラリーがロードされているので、実際にそのスクリプトが既に実行されているようです。 あなたのコードは完全ではないと言います。問題が何であるかを明確にするために何かを投稿できますか? 多くのおかげで、 –
クロムにいる場合、f12を押してコンソールを開きます。あなたはエラーを見ることができるようにJavaScriptを書く時はいつも開いておく必要があります。コンソールに何かエラーがないか確認してください。 –
ありがとうございましたNico、これらのエラーは、リソースを読み込めませんでした:サーバは404のステータスで応答しました(見つからなかった) index.html:28未知のReferenceError:$は定義されていません at index.html:28 /favicon.icoリソースをロードできませんでした:サーバが404のステータスで応答しました(見つからない) –