仿chinaz站长站首页的导航菜单

经常上站长站的朋友应该对这个导航效果不陌生了,我也比较喜欢这样效果,所以花了点时间把站长站的代码弄下来整理了一下!

这个导航在ie6,ie7,ff3下测试没有问题。


关键的js代码如下:
程序代码 程序代码

function $(id) {
    return document.getElementById(id);
}

function showMenu (baseID, divID) {
    baseID = $(baseID);
    divID  = $(divID);
    if (showMenu.timer) clearTimeout(showMenu.timer);
    hideCur();
    divID.style.display = 'block';
    showMenu.cur = divID;

    if (! divID.isCreate) {
        divID.isCreate = true;
        //divID.timer = 0;
        divID.onmouseover = function () {
            if (showMenu.timer) clearTimeout(showMenu.timer);
            hideCur();
            divID.style.display = 'block';
        };

        function hide () {
            showMenu.timer = setTimeout(function () {divID.style.display = 'none';}, 1000);
        }

        divID.onmouseout = hide;
        baseID.onmouseout = hide;
    }
    function hideCur () {
        showMenu.cur && (showMenu.cur.style.display = 'none');
    }
}


好了最后看看演示


下载


[本日志由 亮亮 于 2009-07-11 02:17 PM 编辑]
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags: 仿chinaz站长 导航 菜单
评论: 5 | 引用: 0 | 查看次数: -
回复回复stone[2009-06-25 05:08 PM | del]
倒数第二个即“联盟资讯”的子菜单有错位。我是在IE6下测的。
亮亮的博客漂亮。
亮亮的文章漂亮。
亮亮的功底漂亮。

谢谢亮亮!
引用来自 亮亮 亮亮 于 2009-06-26 09:20 AM 回复
确实有问题,看来站长网的这个菜单有bug,大致开了下,把这个子菜单的数量增多可以解决!有时间看看,修正一下!
回复回复亮亮[2009-06-12 01:02 PM | del]
这个程序我不是我写的,要实现向这样的信息保存,一般是用cookie保存的!!
回复回复javen[2009-06-11 11:24 PM | del]
设计得很好,子菜单在鼠标离开后就应该自动消失,赞一个!
另外,刚才我验证码有误,所以返回了,但回复的信息还保留了,我怎实现这个效果,也就是有时候填了好多的内容,结果提交时候有错误而返回提交页面,但我想保存之前填写的信息,如何实现?用cookie吗?
回复回复julia[2009-05-01 07:22 AM | del]
你好,下载测试效果很好

请问如何固定第一次选择的主菜单下的子菜单不消失,直到下次选择?

效果图同你上面提供的一样,但当前的问题是鼠标离开后,子菜单也消失了?

哪里需要修改?
多谢!
回复回复ASPNet[2008-12-04 10:18 AM | del]
相当不错,能否打个包提供下载啊?学习学习!!
引用来自 亮亮 亮亮 于 2008-12-05 08:16 PM 回复
已打包了!
发表评论
昵 称:
密 码: 游客发言不需要密码.
内 容:
验证码: 验证码
选 项:
虽然发表评论不用注册,但是为了保护您的发言权,建议您注册帐号.