posts - 13, comments - 7, trackbacks - 0, articles - 0

今天练习用jquery写一个级联菜单的小例子,遇到的一个问题,请大家帮忙看一下原因所在。
涉及到的内容有:
页面JqueryMenu.html--------

<html>
  <head>
    <title>JqueryMenu.html</title>
 <script type="text/javascript" src="jslib/jquery.js"></script>
 <script type="text/javascript" src="jslib/jquerymenu.js"></script>
 <link type="text/css" rel="stylesheet" href="css/menu.css"></link>
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
   
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  </head>
 
  <body>
   <ul>
    我是菜单1
    <li>我是二级菜单1</li>
    <li>我是二级菜单2</li>
   </ul>
   <ul>
    我是菜单2
    <li>我是二级菜单1</li>
    <li>我是二级菜单2</li>
   </ul>
   <ul>
    我是菜单3
    <li>我是二级菜单1</li>
    <li>我是二级菜单2</li>
   </ul>
    <ul>
    我是菜单4
    <li>我是二级菜单1</li>
    <li>我是二级菜单2</li>
   </ul>
  </body>
</html>

----------------------------------------
js文件jquery.js 和自己写的jquerymenu.js,内容如下:
//注册页面加载时的执行的事件
$(document).ready(function() {
 //得到所有的ul标签标点
 var uls = $("ul");
 //为ul标签增加mouseover事件
 uls.mouseover(function() {
  //得到当前ul结点
  var ulNode = $(this);
  //将鼠标形状改为手形
  ulNode.css("cursor", "pointer");
 });
 //为ul标签增加单击事件
 uls.click(function() {
  //找到当前ul标签结点
  var ulNode = $(this);
  //得到子标签li
  var lis = ulNode.children("li");
  lis.toggle("show");
 });
 
});

遇到的问题是:用IE浏览器点击一级菜单时,会影响到下面的一级菜单,会闪动一下,而用firefox就没有这个问题,不知道这是原因造成的
请大家一起找找看啊,谢谢




只有注册用户登录后才能发表评论。


网站导航: