[英]menu button active when clicked
I want to make my buttons in the menu bar active, when they are clicked. 我想在菜单栏中点击它们时激活我的按钮。 That also works fine on: portfolio, about, contact. 这也适用于:投资组合,关于,联系。
But the small script is not working on index and services. 但是小脚本不适用于索引和服务。 I have set a body tag on each site. 我在每个网站上都设置了一个body标签。
Does anybody have a clue what could be wrong here? 有没有人知道这里可能有什么问题? It is the exact same code. 它是完全相同的代码。
services.php services.php
<?php include 'resources/includes/header.php' ?>
<body id="services">
<?php include 'resources/includes/navbar.php' ?>
<!-- start intro section -->
<section class="intro">
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<div class="intro-content">
<h1>My services are <strong>focused </strong>primarily </h1>
<h2>in design, coding and marketing automation </h2>
</div>
</div>
</div>
</div>
</section>
navbar.php: navbar.php:
<!-- begin header section -->
<header class="header">
<!-- begin nav -->
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span>Tap me!</span>
</button>
<!-- begin logo in navigation -->
<a class="navbar-brand" href="index.php">
<img src="images/graphic/webdesign.png">
</a>
<!-- end logo in navigation -->
</div>
<div class="navbar-collapse collapse">
<ul class="nav nav-pills nav-main pull-right">
<!-- begin navigation items -->
<li>
<a href="index.php">Index</a>
</li>
<li>
<a href="services.php">Services</a>
</li>
<li>
<a href="portfolio.php">Portfolio</a>
</li>
<li>
<a href="aboutme.php">About Me</a>
</li>
<li>
<a href="contact.php">Contact</a>
</li>
<!-- end navigation items -->
</ul>
</div>
</div>
</div>
</div>
</nav>
<!-- end nav -->
</header
Javascript $(function() { Javascript $(function(){
//highlight the current nav
$("#index a:contains('Index')").parent().addClass('active');
$("#services a:contains('Services')").parent().addClass('active');
$("#portfolio a:contains('Portfolio')").parent().addClass('active');
$("#about a:contains('About Me')").parent().addClass('active');
$("#contact a:contains('Contact')").parent().addClass('active');
});
You are missing the navbar.js script on those two pages. 您缺少这两个页面上的navbar.js脚本。 It's included below main.js on the ones that are working. 它包含在main.js下面的工作中。
<!-- Custom Javascript -->
<script src="js/main.js"></script>
<script src="js/navbar.js"></script> // <-- missing from index and services
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.