导航双重下拉列表

最新推荐文章于 2022-08-06 08:45:06 发布
最新推荐文章于 2022-08-06 08:45:06 发布
阅读量168 收藏
点赞数
原文链接：http://www.cnblogs.com/qurui1998/p/10492266.html
版权 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            *{
                margin: 0px;
                padding: 0px;
                list-style: none;
            }
            ul li{
                float: left;
                margin-left: 3px;
                text-align: center;
                border: 1px solid transparent;
                    width: 90px;
            
            }
            ul li ul {
                display: none;
                
            /*  border: 1px solid red;*/
                width: 100px;
            }
            
        </style>
    </head>
    <body>
        <ul>
            <li onmousemove="ss(1)" onmouseout="h()" >
                <a href="http://www.baidu.com">首页|</a>
                <ul id="s1">
                <li><a href="#">公积金贷款</a></li>
                <li><a href="#">公积金咨询</a></li>
                <li><a href="#">公积金回答</a></li>
                <li><a href="#">表格下载</a></li>
                <li><a href="#">贷款计算器</a></li>
                </ul>
            </li>
            <li onmousemove="ss(2)" onmouseout="h(2)">
                
                <a href="#">公积金查询</a>
                <ul id="s2">
                <li><a href="#">公积金贷款</a></li>
                <li><a href="#">公积金咨询</a></li>
                <li><a href="#">公积金回答</a></li>
                <li><a href="#">表格下载</a></li>
                <li><a href="#">贷款计算器</a></li>
                </ul>
            </li>
            <li onmousemove="ss(3)" onmouseout="h(3)">
                
                <a href="#">政府法规</a>
                <ul id="s3">
                <li><a href="#">公积金贷款</a></li>
                <li><a href="#">公积金咨询</a></li>
                <li><a href="#">公积金回答</a></li>
                <li><a href="#">表格下载</a></li>
                <li><a href="#">贷款计算器</a></li>
                </ul>
            </li>
            <li onmousemove="ss(4)" onmouseout="h(4)">
                
                <a href="#">公积金提取</a>
                <ul id="s4">
                <li><a href="#">公积金贷款</a></li>
                <li><a href="#">公积金咨询</a></li>
                <li><a href="#">公积金回答</a></li>
                <li><a href="#">表格下载</a></li>
                <li><a href="#">贷款计算器</a></li>
                </ul>
            </li>
            
            
        
        </ul>
    </body>
    <script>
        
            function ss(num){
                if(num==1){
                    document.getElementById("s1").style.display="block";
                }else if(num==2){
                    document.getElementById("s2").style.display="block";
                }else if(num==3){
                    document.getElementById("s3").style.display="block";
                }else{
                    document.getElementById("s4").style.display="block";
                }
            }
            function h(){
                    document.getElementById("s1").style.display="none";
                    document.getElementById("s2").style.display="none";
                    document.getElementById("s3").style.display="none";
                    document.getElementById("s4").style.display="none";
            }
        
    </script>
</html>

 

转载于:https://www.cnblogs.com/qurui1998/p/10492266.html

weixin_30300523
关注
WPS表格 下拉列表 两级下拉列表联动 多级下拉列表联动
Wait_you_LOVE的专栏
03-16 1万+
WPS表格 下拉列表 两级下拉列表联动 多级下拉列表联动
电脑常用快捷键大全（含Visual Studio快捷键操作）
流楚丶格念的博客
02-18 5721
目录 一、系统快捷键 二、常用系统命令 三、QQ快捷键 四、IE浏览器快捷键使用大全 五、Word 中的快捷键 六、Excel 中的快捷键 七、PowerPoint 中的快捷键 八、Visual Studio 九、Eclipse 十、Photoshop 十一、批处理指令 十二、安装操作系统 （此快捷操作对我们程序员十分重要，所以放在前面） 八、Visual Studio 8.1、项目相关的快捷键 ...
[入门] 双重关联 下拉式选单(DropDownList)
weixin_30898109的博客
08-11 496
http://www.dotblogs.com.tw/mis2000lab/archive/2008/04/24/3447.aspx [入门]双重关联 下拉式选单(DropDownList) 常常有人在问：这种功能要怎么作？例如：选择「县市」名称后，就会自动跳出相关的「乡镇市区」...... 以前很难做到的功能，现在透过Visual Studio 2005/2...
图表里面双重下拉框进行判断
09-24 274
之前的需求是根据下拉框选择相应的地区来展示相应公司渲染出来的图表，现在多了个需求是再多一个下拉框判断型号，这两个判断要可以同步进行 也就是选择相应地区再选择相应型号，图表要展示相应的内容 我的写法可能有点笨拙，先判断全部地区下是否为全部型号，再判断不同地区下是否为全部型号，也就是四个部分（如果有好的想法麻烦指教一下） 放上源码供参考（url接口自己找，这个公司内部不方便透露） ...
双下拉框的用法
thigh_d的博客
08-03 397
双下拉框的用法 通过改变一个下拉框的数据，另一个下拉框也跟着改变数据。 实现原理 通过双向数据绑定v-model绑定值，然后在使用v-for循环遍历下拉框数据
双重导航菜单特效代码
03-20
主导航可能会使用`<ul>`和`<li>`元素来创建一个无序列表，而次级导航则可能作为主导航项的下拉菜单，通过CSS的`display`属性进行显示与隐藏的控制。例如，当鼠标悬停在主导航项上时，通过JavaScript或jQuery触发次级...
制作一个简单HTML静态网页（HTML+CSS）
wx___BJ050106的博客
08-06 460
🍵茶文化网站、🏳️‍🌈中华传统文化题材、京剧文化🔏水墨风书画、中国民间年画文化艺术网站 、等网站的设计与制作。🏷️ 这个首页代码运用了DIV盒子的使用方法，如盒子的嵌套、浮动、margin、border、background等属性的使用，外部大盒子设定居中，内部左中右布局，下方横向浮动排列，大学学习的前端知识点和布局方式都有运用，CSS的代码量也很足、很细致，使用hover来完成过渡效果、鼠标滑过效果等，使用表格、表单补充模块，为方便新手学习, 个别源码页面中没有使用js有需要的可以自行添加。🏅......
帝国下载系统 v2.5 开源正式版 bulid 090416.rar
07-17
76、新增下拉式列表分页模板。 77、新增框架登陆状态模板与JS登陆状态模板及调用方式。 78、新增最终下载页模板。可以直接在后台修改下载页面，直接加广告或显示软件信息。 79、模板标签调用改进： (1)、操作...
Android代码-Saraba1st论坛的安卓客户端
08-08
图片下载采用 Volley, 图片缓存为 LruCache DiskLruCache 的双重缓存 使用 largeHeap 避免加载大量图片的帖子时出现 OOM 使用 Jsoup分析返回的网络请求 缓存了论坛列表和帖子列表, 如果内存有历史记录就从历史记录...
jquery之双下拉框
fish_whale的博客
09-29 474
仿照doublebox-boostrap的功能写的一个双边栏选择框，主要实现：左右互移，模糊查询 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;jquery之双下拉框&lt;/title&gt; &lt;style type=&quo
Html和CSS入门(笔记)—HTML
weixin_44595042的博客
02-26 1702
Html和CSS入门 第一章 Html介绍 1-1 代码初体验-Hello World网页 1-2 Html和CSS的关系 1-3 认识 Html标签 1-4 标签的语法 1-5 认识html文件基本结构 1-6 认识head标签 1-7 了解HTML的代码注释 第二章 认识标签（第一部分） 2-1 语义化，让你的网页更好的被搜索引擎理解 2-2 &amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;body&
导航条多个tab切换，实现筛选效果
AliceWu的博客
04-27 2133
实现该效果的核心是使用data-**的自定义属性 html导航条代码 &lt;ul class="tab"&gt; &lt;li data-type="all"&gt;全部&lt;/li&gt; &lt;li data-type="welfare"&gt;福利&lt;/li&gt; &lt;li data-type="s
嵌套双重c:forEach，下拉框显示时重复
FanJizhi的博客
06-15 3791
修改前代码： 修改前效果： 修改后代码： 修改后效果： 问题解决方案： 第一层循环内使用c:set声明一个变量，为变量声明一个默认值，第二层循环内做条件判断如果条件一致，为变量修改默认值（默认值=0），第二层循环完后，根据变量进行判断，假设变量默认等于1正常输出，假设默认值等于0，输出想要输出的效果
小程序多级下拉菜单demo
热门推荐
github_39371177的博客
05-09 1万+
最近公司需要开发小程序，中间碰到需要下拉面板选择的功能。在网上寻找demo，然后自己进行了一定的更改。截图：不多说，直接 上代码.wxml&lt;view class='selectarea'&gt; &lt;dl class="menu"&gt; &lt;block wx:for="{{menuContent}}" wx:for-index='index' wx:for-it...
地级市GDP及产业结构数据-最新.zip
最新发布
11-14
地级市GDP及产业结构数据-最新.zip
2006-2023年上市公司资产误定价Misp数据集（4.9万样本，含原始数据、代码及结果，最新）.zip
11-14
2006-2023年上市公司资产误定价Misp数据集（4.9万样本，含原始数据、代码及结果，最新）.zip
js搜索框双重下拉菜单
02-01
JS搜索框双重下拉菜单是一种常见的网页搜索功能，它可以提供更加便捷和智能的搜索体验。下面是一种实现方式： 1. HTML结构： ```html 请输入关键词"> <div id="searchResults"></div> ``` 2. JavaScript代码： ```...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值