首页 新闻 会员 周边 捐助

如何动态的做导航

0
悬赏园豆：100 [待解决问题]

如何把导航的内容从数据库中取出 做成http://www.cqu.edu.cn/这个样式 可以自主添加二级三级导航 并

点碎落花声的主页 点碎落花声 | 初学一级 | 园豆：45
提问于：2012-09-19 20:36
< >
分享
所有回答(4)
0

jquery有很多优秀的menu插件的

chenping2008 | 园豆：9836 (大侠五级) | 2012-09-19 21:28

你可以通过查看那个网页的源代码文件的js来看看它是如何实现的。

支持(0) 反对(0) chenping2008 | 园豆：9836 (大侠五级) | 2012-09-19 21:35
0 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        #navigation
        {
            width: 784px;
            padding: 8px;
            margin: 8px auto;
            background: 3b5998;
            height: 18px;
        }
        #navigation ul li
        {
            float: left;
            margin-right: 14px;
            position: relative;
            z-index: 100;
        }
        #navigation ul li a
        {
            display: block;
            padding: 0 8px;
            background: #EEEEEE;
            font-weight: 700;
        }
        #navigation ul li ul
        {
            background-color: #88c366;
            position: absolute;
            width: 80px;
            overflow: hidden;
            display: none;
        }
        #navigation ul li:hover ul
        {
            background-color: #88C366;
            position: absolute;
            width: 100px;
            display: block;
        }
        #navigation ul li ul li
        {
            border-bottom: 1px solid #BBB;
            text-align: left;
            width: 100%;
        }
    </style>
</head>
<body>
    <div id="navigation" class="navigation">
        <ul>
            <li><a href="#">首页</a></li>
            <li><a href="#">衬衫</a>
                <ul>
                    <li><a href="#">短袖衬衫</a></li>
                    <li><a href="#">长袖衬衫</a></li>
                    <li><a href="#">无袖衬衫</a></li>
                </ul>
            </li>
            <li><a href="#">卫衣</a>
                <ul>
                    <li><a href="#">开襟卫衣</a></li>
                    <li><a href="#">套头卫衣</a></li>
                </ul>
            </li>
            <li><a href="#">裤子</a>
                <ul>
                    <li><a href="#">休闲裤</a></li>
                    <li><a href="#">卡其裤</a></li>
                    <li><a href="#">牛仔裤</a></li>
                    <li><a href="#">短裤</a></li>
                </ul>
            </li>
            <li><a href="#">联系我们</a></li>
        </ul>
    </div>
</body>
</html>

这是一个最简单的导航和你要的效果差不多 希望能帮到你

强者运强 | 园豆：338 (菜鸟二级) | 2012-09-19 21:42

效果能做出来 我想把导航的内容是从数距库中取出 便于维护 这咋做 谢谢

支持(0) 反对(0) 点碎落花声 | 园豆：45 (初学一级) | 2012-09-19 23:47

@点碎落花声:没有做多你要求的那样的，不懂怎么去做，不过我感觉对于导航这个来说完全没有必要放到数据库再取出来那么麻烦，就这样直接下代码量也很少啊，你给的那个链接里的导航也是直接写在页面里的

支持(0) 反对(0) 强者运强 | 园豆：338 (菜鸟二级) | 2012-09-20 21:05
0

你把你的导航先从数据库取出来放到datatable里面，然后根据需要取出，放到对应的div li里面。就可以按要求显示了。

NewSoftsNet | 园豆：92 (初学一级) | 2012-09-22 17:34
0

http://www.100sucai.com/code/248.html

1565783227 | 园豆：227 (菜鸟二级) | 2014-08-18 13:56
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。