有人可以帮我做水平菜单吗?我想在这个菜单上制作一个页面,我需要向css文件添加新类。我希望你能理解我。谢谢
这就是我现在拥有的:菜单主题2.css
<ul class="theme2">
<li><a href="index.php"><span>HOME</span></a></li>
<li><a href="kredity.php"><span>KREDITY</span></a></li>
<li><a href="shop.php"><span>SHOP</span></a></li>
<li><a href="aukce.php"><span>AUKCE</span></a></li>
<li><a href="servery.php"><span>SERVERY</span></a>
<li><a href="forum"><span>FORUM</span></a></li>
</ul>
我希望这个在索引.php:
<ul class="theme2">
<li><a class="active" href="index.php"><span>HOME</span></a></li>
<li><a href="kredity.php"><span>KREDITY</span></a></li>
<li><a href="shop.php"><span>SHOP</span></a></li>
<li><a href="aukce.php"><span>AUKCE</span></a></li>
<li><a href="servery.php"><span>SERVERY</span></a>
<li><a href="forum"><span>FORUM</span></a></li>
</ul>
尝试这样的事情。
对于水平菜单,您可以在 css 文件中放置以下 css 规则。
.theme2 li {
float: left;
list-style: outside none none;
margin-left: 10px;
}
对于活动类。
$(function(){
var url = window.location.pathname;
alert(url);
urlRegExp = new RegExp(url.replace(//$/,'') + "$");
// create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there
// now grab every link from the navigation
$('.theme2 ul li a').each(function(){
// and test its normalized href against the url pathname regexp
if(urlRegExp.test(this.href.replace(//$/,''))){
$(this).addClass('active');
}
});
});
index.php
<?php $page = "index"; ?>
shop.php
<?php $page = "shop"; ?>
<ul>
<li><a <?php if($page == 'index') {echo 'class="active"';} ?> href="index.php"><span>HOME</span></a></li>
<li><a <?php if($page == 'shop') {echo 'class="active"';} ?> href="index.php"><span>SHOP</span></a></li>
</ul>
按照 Nikit 的解决方案,您可以使用 PHP 的 __FILE__
常量执行以下操作,而无需在每个页面中设置$page
变量值:
<ul>
<li><a <?php if(basename(__FILE__, '.php') == 'index') {echo 'class="active"';} ?> href="index.php"><span>HOME</span></a></li>
<li><a <?php if(basename(__FILE__, '.php')== 'shop') {echo 'class="active"';} ?> href="index.php"><span>SHOP</span></a></li>
</ul>