关于javascript修改二级菜单display属性的问题-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

关于javascript修改二级菜单display属性的问题

2016-03-17 12:27:24 2089 0

网页的主体是菜单,二级菜单是隐藏的,以下为一个“书籍”菜单的代码。其中二级菜单的高的数值比一级菜单的要大,所以限制了一级菜单的高度,也声明了二级菜单的高度,计算后的二级菜单的高度也是声明了的二级菜单的高度,但是js控制二级菜单的时候,鼠标指针在二级菜单的停留的高度是一级菜单的高度。
代码如下:

 <div id="book">
            <div id="menu1" class="menu" onmouseover="changeDisplay1()" onmouseout="recoverDisplay1()" >
                <p class="title">书&nbsp&nbsp籍</p>
            </div>
            <div id="frame1" class="frame" style="display:none;" onmouseover="this.style.display='block'" onmouseout="this.style.display='none'">
                <ul style="color:#FFF;font-family:STFangsong;width:450px;margin-left:100px;margin-top:10px;padding-top:5px;">
                    <li>
                        &nbsp&nbsp&nbsp文&nbsp&nbsp艺&nbsp&nbsp&nbsp|<a href="../二级页面/index2.html">小说</a> <a href="../二级页面/index2.html">文学</a> <a href="../二级页面/index2.html">传记</a> <a href="../二级页面/index2.html">艺术</a> <a href="../二级页面/index2.html">青春文学</a>
                    </li>
                    <li>
                        人文社科|<a href="../二级页面/index2.html">历史</a> <a href="../二级页面/index2.html">心理学</a> <a href="../二级页面/index2.html">政治/军事</a> <a href="../二级页面/index2.html">国学/古籍</a>           <a href="../二级页面/index2.html">哲学/宗教</a> <a href="../二级页面/index2.html">社会科学</a>
                    </li>
                    <li>
                        经管励志|<a href="../二级页面/index2.html">经济</a> <a href="../二级页面/index2.html">管理</a> <a href="../二级页面/index2.html">金融与投资</a> <a href="../二级页面/index2.html">励志与成功</a>
                    </li>
                    <li>
                        &nbsp&nbsp&nbsp科&nbsp&nbsp技&nbsp&nbsp&nbsp|<a href="../二级页面/index2.html">科普</a> <a href="../二级页面/index2.html">IT</a> <a href="../二级页面/index2.html">建筑医学</a> <a href="../二级页面/index2.html">工业通信</a> <a href="../二级页面/index2.html">电子技术</a>         <a href="../二级页面/index2.html">农林</a> <a href="../二级页面/index2.html">科学与自然</a>
                    </li>
                    <li>
                        &nbsp&nbsp&nbsp教&nbsp&nbsp育&nbsp&nbsp&nbsp|<a href="../二级页面/index2.html">教材</a> <a href="../二级页面/index2.html">教辅</a> <a href="../二级页面/index2.html">考试</a> <a href="../二级页面/index2.html">外语学习</a>
                    </li>
                </ul>
            </div>
        </div>
 #book{
    height:75px;
}
.menu{
    background:url("image/menu.png");
    background-repeat:no-repeat;
    width:328px;
    height:68px;
    padding-top:7px;
}
#menu1{
    margin-left:120px;
}
#frame1{
    background:url("image/frame1.png");
    background-size:100%;
    background-repeat:no-repeat;
    width:600px;
    height:188px;
    margin-top:-80px;
    margin-left:378px;
}
 function changeDisplay1(){
    document.getElementById("frame1").style.display="block";
}
function recoverDisplay1(){
    document.getElementById("frame1").style.display="none";
}
取消 提交回答
全部回答(0)
相关问答

1

回答

如何在js里为activex控件里的方法传入byte的数组

2016-06-01 13:51:10 1826浏览量 回答数 1

1

回答

用 js 实现随机选取 10–100 之间的 10 个数字,存入一个数组,并排序。

2019-11-28 14:41:20 578浏览量 回答数 1

1

回答

面试之js 数组插入删除

2019-12-16 13:57:58 592浏览量 回答数 1

1

回答

js 实现两个数组(一个数组包含于另一个数组中)元素组成第三个数组

2020-01-07 13:21:19 601浏览量 回答数 1

1

回答

从JS数组中删除重复的值[duplicate]

2020-01-13 09:57:12 375浏览量 回答数 1

1

回答

使用jQuery将JS对象转换为数组

2020-01-15 09:59:37 303浏览量 回答数 1

1

回答

将JS数组拆分为N个数组

2020-02-08 20:39:02 311浏览量 回答数 1

1

回答

js里面如何让数组的元素进行前后比较?

2020-05-27 09:59:18 816浏览量 回答数 1

1

回答

同样多的请求,请问是在前台通过js循环发送多次请求好些,还是把数组传入后台,从后?400报错

2020-06-03 14:40:20 465浏览量 回答数 1

1

回答

传统的表单控件textarea元素不支持通过javascript设置readonly属性示例是什么?

2022-03-14 21:48:28 314浏览量 回答数 1
文章
问答
问答排行榜
最热
最新
相关电子书
更多
Javascript中的对象
立即下载
Javascript中的函数
立即下载
JavaScript 语言在引擎级别的执行过程
立即下载