javaScript基础练习题-下拉框制作(JQuery)
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0px; padding:0px;}
#menu{ background-color:#eee; width:600px; height:40px; margin:0 auto;}
ul{ list-style:none;}
ul li{ line-height:40px; text-align:center; position:relative; float:left;}
a{ text-decoration:none; color:#000; display:block; width:90px;}
a:hover{ color:#FFF; background-color:#666;}
ul li ul li{ float:none;margin-top:2px; background-color:#eee; }
ul li ul{width:90px; position:absolute; left: 0px;top: 40px; display: none;}
/** ?*/
/**ul li:hover ul{display: block}*/
</style> <script src="/home/rocky/develop/jquery/jquery-1.7.2.js" ></script>
<script type="text/javascript">
$(function(){
alert("123");
$(".navmenu").mouseover(function(){
$(this).children("ul").show();
})
$(".navmenu").mouseout(function(){
$(this).children("ul").hide();
})
});
</script> </head> <body>
<div id="menu">
<ul>
<li ><a href="#">首页</a></li>
<li class="navmenu"><a href="#">课程大厅</a>
<!-- ?-->
<ul>
<li><a href="#">JavScript</a></li>
<li><a href="#">JQuery</a></li>
</ul>
</li>
<li class="navmenu" ><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></li>
<li><a href="#">关于我们</a></li>
</ul>
</div>
</body>
</html>
javaScript基础练习题-下拉框制作(JQuery)的更多相关文章
- javaScript基础练习题-下拉框制作
1.基础回顾 如何让一个段javascript在文档加载后执行,(因为自己忘了,所以顺便复习一下) window.onload = function(){}; <!DOCTYPE html PU ...
- javaScript基础练习题-下拉框制作(CSS)
http://www.imooc.com/video/155 慕课网的视频,直接上代码 <!DOCTYPE hmtl> <html> <head> <meta ...
- javaScript基础练习题-下拉框制作(神奇的代码)
http://www.oschina.net/code/snippet_12_46548#66319 http://www.codeproject.com/Tips/890021/Advanced-C ...
- JavaScript向select下拉框中加入和删除元素
JavaScript向select下拉框中加入和删除元素 1.说明 a 利用append()方法向下拉框中加入元素 b 利用remove()方法移除下拉框中最后一个元素 2.设计源代码 < ...
- JavaScript向select下拉框中添加和删除元素
JavaScript向select下拉框中添加和删除元素 1.说明 a 利用append()方法向下拉框中添加元素 b 利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...
- JavaScript解决select下拉框中的内容太长显示不全的问题
JavaScript解决select下拉框中的内容太长显示不全的问题 1.说明 有些情况下,select下拉框的内容过长,导致部分看不见: 现在通过鼠标事件,让下拉框中的内容显示完全 2.实现源码 & ...
- JavaScript获取select下拉框中的第一个值
JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...
- Javascript获取select下拉框选中的的值
现在有一id=test的下拉框,怎么拿到选中的那个值呢? 分别使用javascript原生的方法和jquery方法 <select id="test" name=" ...
- div模拟的下拉框特效jquery
从网上找来的,感觉不错就拿来分享下 <style type="text/css"> body, ul, li { margin: 0; padding: 0; font ...
随机推荐
- 如何使用AutoIT完成单机测试
下面我们来介绍如何使用AutoIT完成单机程序的自动化测试.使用AutoIT完成桌面应用程序的自动化测试,最重要的是找到识别GUI对象的方法,然后调用AutoIT函数来操纵它或读取它的属性值,并与正确 ...
- Windows系统安装Oracle 11g数据库
一.下载 http://www.oracle.com/technetwork/database/enterprise-edition/downloads/index.html以下两网址来源此官方下载页 ...
- [转] Linux下防火墙iptables用法规则详及其防火墙配置
from: http://www.cnblogs.com/yi-meng/p/3213925.html 备注: 排版还不错,建议看以上的链接. iptables规则 规则--顾名思义就是规矩和原则,和 ...
- 2666 Accept Ratio(打表AC)
2666 Accept Ratio 时间限制: 1 s 空间限制: 32000 KB 题目等级 : 钻石 Diamond 题解 查看运行结果 题目描述 Description 某陈痴迷 ...
- 04SpringMvc_映射器_BeanNameUrlHanderMapping
这篇文章我们讲的是映射器,映射器的作用是什么样的请求交给Action,如果我们没有在xml配置文件中进行配置,默认的就是BeanNameUrlHanderMapping. 我们讲一个案例增加用户的案例 ...
- 使用DataAnnotations实现数据验证
https://msdn.microsoft.com/zh-cn/library/system.componentmodel.dataannotations.aspx http://www.cnblo ...
- wireshark排查打印机问题
抓包工具排除故障 前言:上网慢,可能是内网堵了.装上wireshark,可抓到广播包,多播包,以及发给自己的包.如果想抓lan内其他人之间的通信包,那就要在sw上做端口镜像. 背景 调试打印机的人发现 ...
- Oracle11G 卸载步骤
(之前因为不知道偶电脑是因为安装了oracle后,才导致的长达两周的开机速度要足足10分钟,以前只有一分钟不到!可以想象oracle的服务启动的强大,知道后,偶果断立即卸载掉!) 一.在oracle1 ...
- 【每日学习】Apache重写未开启,导致The requested URL /xxxx.html was not found on this server
今天把项目环境从集成换成独立的,全部搭建好后,网站主页www.xxx.com能打开,但一涉及到跳转,带参数,比如 www.xxx.com/xxx/xxx.html 就会报错 The requested ...
- Tomcat7.x 与 Tomcat6.x
试用 Tomcat7.x 与 Tomcat6.x 的明显不同 + Context 填写方法 + 默认应用配置方法 标签: tomcat数据库驱动程序数据库虚拟机jdbcjavascript 2012- ...