gpt4 book ai didi

html - 导航栏 - 如果事件 URL 突出显示背景?

转载 作者:行者123 更新时间:2023-11-28 13:41:31 26 4
gpt4 key购买 nike

感谢您抽出宝贵时间查看此内容。

我们在 magento 上有一个标准的导航栏,我设法复制了它(通过复制和编辑 html/css 的位)并将它放在原始导航栏下方 - 所以我们实际上有 2 个。

原始导航栏通过 magento 代码工作并识别类别 URL 是否处于事件状态,然后该类别的导航栏以红色突出显示。

我现在想尝试复制这个,我们将不胜感激任何帮助。我在本地进行此操作,因此很遗憾无法提供网站链接。

HTML:

 <div class="nav-container2">
<ul id="nav2">
<li class="downloads"><a href="http://127.0.0.1/foscamsite/downloads" id="Downloads"><span>Downloads</span></a></li>
<li class="forum"><a href="http://127.0.0.1/foscamsite/forum" id="Forum"><span>Forum</span></a></li>
</ul></div>

CSS:

.nav-container2 { width:940px; margin:auto; height:30px;}
#nav2 { width:547px; height:40px; float:right; margin:1px 0 0 0; font-size:105%; background:url(../images/bg-nav.png) 0 0 repeat-x; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; box-shadow:0 0 3px #ccc; }
#nav2 li { position:relative; text-align:left; }
#nav2 li.over { z-index:998; }
#nav2 a,
#nav2 a:hover { display:block; line-height:1.3em; text-decoration:none; }
#nav2 span { display:block; cursor:pointer; white-space:nowrap; }
#nav2 li ul span {white-space:normal; }
#nav2 ul li.parent a { background:url(../images/bkg_nav2.gif) 100% 100% no-repeat; }
#nav2 ul li.parent li a { background-image:none; }
#nav2 li { float:left; margin:0 1px 0 0; }
#nav2 li.active a { background:url(../images/bg-nav-hover.png) 0 0 repeat-x; color:#fff; }
#nav2 a { float:left; padding:12px 14px 11px; color:#787878; font-size:105%; }
#nav2 li.over a,
#nav2 a:hover { background:url(../images/bg-nav-hover.png) 0 0 repeat-x; color:#fff; }

感觉不需要此 CSS 中的某些内容,只是没有从修改它的地方开始。

非常感谢!

最佳答案

试试这个。请注意,我已经取消了服务器地址并使 URL 成为相对的,因此希望它可以更简单地迁移到实时服务器:

<?php

echo "<div class=\"nav-container2\">\n";
echo "<ul id=\"nav2\">\n";
echo "<li class=\"downloads";
if ($_SERVER['REQUEST_URI'] == "/foscamsite/downloads") echo " active";
echo "\"><a href=\"/foscamsite/downloads\" id=\"Downloads\"><span>Downloads</span></a></li>\n";
echo "<li class=\"forum";
if ($_SERVER['REQUEST_URI'] == "/foscamsite/forum") echo " active";
echo "\"><a href=\"/foscamsite/forum\" id=\"Forum\"><span>Forum</span></a></li>\n";
echo "</ul>\n";
echo "</div>\n";

?>

关于html - 导航栏 - 如果事件 URL 突出显示背景?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12326215/

26 4 0