还是导航变换背景有关问题-JavaSript-爱易网页

还是导航变换背景有关问题

日期：2014-05-16　浏览次数：20333 次

还是求助导航变换背景问题
想做成这个页面的导航效果，http://download.csdn.net/ 就是点击了这个页面的排行榜那么新的页面排行榜上就变换，这个点击我通过cookie已经弄出来了，现在还有一个功能就是输入网址直接打开对应的导航也变换，比如地址栏直接打开http://download.csdn.net/rankings 这个网址，它的排行榜这个菜单上也和其它不一样，是根据网址来分析吗？这个是不是通过js来完成的，求助怎么做的？

------解决方案--------------------
获取当前的url路径location.pathname，然后和导航中的链接匹配，匹配了就设置焦点样式

建立1.html,2.html,3.html,4.html文件，内容全部为下面的



<div id="dvGuider">

<a href="1.html">1.html</a>

<a href="2.html">2.html</a>

<a href="3.html">3.html</a>

<a href="4.html">4.html</a>

</div>

<style>

a.focus{background:#ff0000;color:#ffffff;}

</style>

<script>

    var pn = location.pathname;

    var as = document.getElementById('dvGuider').getElementsByTagName('a');

    for (var i = 0, j = as.length; i < j; i++)

        if (as[i].href.indexOf(pn) != -1) {as[i].className = 'focus';break;}

</script>

------解决方案--------------------
这个是很简单的，定义一个变量
放在导航那里
不是用cookie等做的啦
比如
<a href='index.asp' <%=indexon%>>首页</a>
<a href='down.asp' <%=downon%>>下载</a>
<a href='paihang.asp' <%=paihon%>>排行</a>
在index.asp，down.asp，paihang.asp，分别定义上面三个变量的值，为空的就不调用了
比如indexon=" class=""on"""
------解决方案--------------------
是否想这样的效果，可以运行下看效果.



<!doctype>

<html>

    <head>

        <meta charset="utf-8">

        <style type="text/css">

            a.mouseOver {

                background-color: red;

            }

        </style>

        <script type="text/javascript">

            window.onload = function(){

                var lis = document.getElementById("links").getElementsByTagName("li");

                

                for (var i = lis.length - 1; i >= 0; i--) {

                    var aE = lis[i].getElementsByTagName("a")[0];

                    aE.addEventListener("mouseover", changeBackgroud);

                    aE.addEventListener("mouseout", changeBackgroud);

                }

       &n

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

还是导航变换背景有关问题

相关资料更多>

推荐阅读更多>