JS基础-下拉菜单案例

要实现的效果:
JS基础-下拉菜单案例_第1张图片

整体思路:

1.布局思路:我外面用了一个大div包裹,里面是ul里面4个li,每个li里面包括上面的a标签和下面的ul列表,下面的ul列表包含3个li。下面的ul采用的是绝对定位。

2.功能实现思路:首先获取元素,获取的是上面的4个li元素,给每个li一个onmouseover事件,然后移动到li的时候就先干掉所有人把当前li的第二个子元素节点显示出来(也就是下面那个列表)。

完整代码:





    
    
    
    下拉菜单案例