jquery横向下拉导航菜单，html导航栏下拉菜单横向居中

div+css制作横向下拉式菜单方面的问题

1、你的菜单问题是不兼容IE6，IE6下二级菜单位置向右偏了，而且二级菜单没有横向显示，而是纵向显示了。我把需要修改的地方用css hack写出来了。修改后的兼容IE6/7/8。不过你这菜单本身也不支持firefox，chrome，你可以找个好点的菜单，搜下jquery二级菜单，很多的。

2、-- /style添加一个DIV标签，在页面中划分出一个块来，用来显示。 div中所用的样式为刚才咱们声明的样式“jiao”这个盒子来描述 然后使用无序标签ul+样式li 来实现模块。

3、如图，制作导航条菜单一般是用一个div嵌套ul和li标签，然后li里面有a标签。布局做好之后，开始写导航条的样式，如图，先清除导航条的margin和padding。然后定位导航条的div，这里我就用绝对定位来居中，如果你有其他导航条居中方法可以忽略这一条。

相关问答

Q1: HTML网页怎样制作二级下拉菜单,二级滑动菜单

首先需要打开自己电脑上的DW软件，新建一个html页面，然后将其保存在桌面上。接下来我们需要在body里面添加DIV标签，并在其内使用ul无序列表和li标签制作一个一级菜单栏，代码和浏览器的效果如下面两张图片所示。因为菜单栏一般都是有链接的，我们就需要为每个li标签添加一个a标签，并增加适当的样式。

打开Dreamweaver，点击 文件-新建 菜单，创建一个HTML文件，输入网站导航栏文字，并选中输入的文字，在下面的属性栏链接处加一个空链接：#。然后保存该网页文件。点击 窗口-行为 菜单，打开行为面板。选中第一步输入的文字，点行为面板上的+号，在弹出的菜单中选-显示弹出式菜单。

现在我们为nav添加样式，首先去掉默认的margin和padding，再去掉ul li标签的list-style样式和a标签的默认下划线。

Q2: 如图使用jquery设计下拉菜单,默认子菜单隐藏,点击父菜单,展开子菜单...

1、点击展开或隐藏菜单，最好在菜单前加一个图标按钮，美观又方便。如果想像你这样实现，最好在每一个ul和li加上ID（这个ID必须是有规律的，比如父ID为1_1，子ID1_1_..），用链接的点击事件根据ID获取父菜单和子菜单实现改变ul、li的display样式就可以实现展开或隐藏。

2、这是防止程序冒泡，因为你点了字菜单，同时也点击了父菜单，父菜单的程序也会执行，加上这个就可以防止冒泡了。

3、利用Jquery的ready函数实现整个页面的加载完成后执行动作。$(function(){})；是$(document).ready(function(){})；的简写 在function内部实现鼠标进入事件，以及所有下拉效果的实现。

4、每个子菜单都是一个dd节点，在展开收起的时候会对每个dd执行效果。看起来就好像百叶窗的效果了。

5、点击之后，菜单一就会被折叠起来，轮到菜单二展开。也就是说，默认情况下会有一个菜单处于展开状态。哈哈，到此，折叠菜单就制作完了。最后来说说新手可能遇到的问题，如图，一定不要漏掉红色框中的rel=stylesheet，因为连接外部的css文件必须用到它，否则就没有折叠效果的哦。

Q3: 用jquery写一个下拉菜单,打开页面时A菜单是展开状态,点击B菜单收起A菜单...

1、点击展开或隐藏菜单，最好在菜单前加一个图标按钮，美观又方便。如果想像你这样实现，最好在每一个ul和li加上ID（这个ID必须是有规律的，比如父ID为1_1，子ID1_1_..），用链接的点击事件根据ID获取父菜单和子菜单实现改变ul、li的display样式就可以实现展开或隐藏。

2、用jquery实现比较省事，同一页面可以反复使用，要配合css设置样式。

3、把修改iframe内容的代码写在上级页面中，使用函数包装起来 function xx {...}，在iframe中的事件中调用上级页面的函数来实现修改iframe的内容，否则，一旦你的iframe的src发生变化，后续的代码就不能继续执行了。

4、方法步骤如下：首先打开计算机，然后打开前端编辑软件，新建一个html文件。

5、JQ其实还可以写得更少(Write Less)。而且你那样写有一个毛病，那就是用光标在的菜单上来回快速晃动几个，再移开光标时，你会发现，下拉的菜单它还在那里一上一下晃着。

Q4: jquery的下拉菜单,鼠标移动到子菜单,没移动到最下面,它就自动收缩回去...

1、如果你用的onmouseout事件，建议你换成onmouseleave试试，因为存在事件冒泡的问题。如果存在子菜单，在子菜单上面也bind一个onmouseenter和onmouseleave事件。

2、JQ其实还可以写得更少(Write Less)。而且你那样写有一个毛病，那就是用光标在的菜单上来回快速晃动几个，再移开光标时，你会发现，下拉的菜单它还在那里一上一下晃着。

3、先感谢以下楼上那个大神提供的CSS效果，我第一次用，感觉很不错 但是，看了一下，那个渐变效果毕竟是CSS3的属性，对于较老的浏览器就会失灵，还是用js实现可能更保险些。

4、你好！第一个问题解决思路：每个一级菜单设置hover事件没有问题，但是你的代码中显示的二级菜单却成为了全局所有的了，所以需要修改为当前一级菜单下面的$(.subCategory)元素，即 $(一级菜单).find(.subCategory)--- 这样才会显示为当前一级菜单下的二级菜单。

5、你说的情况是光标漂移，这种情况可能不是鼠标的问题，怀疑是你电脑上的控制键老化了或者卡住了有粘连，仔细看一看电脑上的键盘，消除键盘上的故障，问题就应该得到解决了。除此之外，还有另外一种可能，就是如果你近期升级了键盘的驱动，这个区用也可能是不正确的，需要卸载掉并且换回原来正确的驱动。

jquery横向下拉导航菜单的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于html导航栏下拉菜单横向居中、jquery横向下拉导航菜单的信息别忘了在本站进行查找喔。