js制作的鼠标悬浮时产生的下拉框效果

先给大家补补课，讲个简单的例子：复制代码代码如下: <html><head> <meta type-equiv="Content-Type" content="text/html"> <meta charset="utf-8″> <script type="text/javascript"> jq=jQuery.noConflict(); jq=(document).ready(function(){ jq("a").mouseover(function(){ jq("a").css("color","#c00″); }); jq("a').mouseout(function(){ jq("a").css("color","#000000″); }); </script> </head><body> <a href="www.jb51.net">鼠标放在上面看看会发生什么</a> </body></html> jq=jQuery.noConflict(); 这是定义一个js的jquery库名； jq(document).ready(function(){ /*这是一个关于document对象的函数里面是函数内容*/ })； jq("a").mouseover()function(){ /*这是定义事件mouseover的内容*/ }。在看一个实际例子；点击时隐藏文本：复制代码代码如下: <html><head> <script type="text/javascript"> $(document).ready(function() { $(".abc .hide").click(function() { $("this").parents("abc").hide("slow"); }); }); </script> <stype type="text/css"> div.abc { background: #e5eec; padding: 7px; margin: 0px; border: solid 1px #c00; } </stype> </head><body> <div class="abc"> <p><button class="abc" type="button">hide<button><br/> 这段文字将被隐藏<br/> 这段文字也将被隐藏 </p></div> <div class="abc"><p> <button class="abc" type="button">hide me</button><br/> 这段文字在点击hideme时隐藏<br/> 这段文字同样也会隐藏。 </p></dvi> </body></html> 功课差不多了，我们言归正传回到主题下拉框才是王道。复制代码代码如下: <html><head> <!–author linuxa blogs: www.jb51.net–> <meta http-equiv="content-type" content="text/html"> <meta charset="utf-8″> <title>下拉框的制作</title> </head><body> </body></html>

　　推荐阅读

　　Javascript引用指针使用介绍

请尝试完成下列完形填空：复制代码代码如下: /* 创建一个队列，头为head0，尾为tail0 */ function IntList(head0, tail0){ this.head = head0 || 0; this.tail = tail0 || null; } /* 返回一个IntList包含数组中>>>详细阅读

本文标题：js制作的鼠标悬浮时产生的下拉框效果

地址：http://www.17bianji.com/kaifa2/JS/22982.html

1/2 1