jQuery实现下拉菜单的样式显示问题。

用jQuery实现下拉很简单。
1、
鼠标经过主菜单时，背景是红色的，同时出现下拉菜单，但是，如果鼠标移动到下拉菜单上，主菜单的背景色又还原了。这个问题要怎么解决？
2/
 如果，鼠标移动到主菜单上，是改变主菜单的图片，而不是改变样式，这个又要怎么处理？
   代码大致这样：
 <ul>
     <li><img src='鼠标经过时是一种图片，离开后又是另外一种图片'>
        <ul>
           <li>111</li>
            <li>222</li>   
         </ul>
     </li>
     <li></li>
     <li></li>
 </ul>

解决方案 »

  1.   

    你把代码发出来吧其实你把选择器img换成li就解决了第一个问题了
    第二个是更改attr("src","")就可以了
      

  2.   

    <li> <a href="lianxiwm1.aspx"><img src="images/top_10.jpg" width="119" height="58" border="0" id="Image5" onmouseover="MM_swapImage('Image5','','images/top_10_1.jpg',1)" onmouseout="MM_swapImgRestore()" /></a>
                                          <ul>
                                            <li><a href="gywm.aspx?id=40">公司概况</a></ >
                                            <li><a href="gywm.aspx?id=41">组织结构</a></>
                                            <li><a href="gywm.aspx?id=42">企业文化</a></ >
                                            <li><a href="gywm.aspx?id=43">员工风采</a></ >
                                            <li class="bottom">< >
                                          </ul>
                                      </ >这个MM_swapImage 是用软件生成的，鼠标经过的事件。
     
      

  3.   

    我晕哦~~这2个MM_swapImage要重新改你可以这样就行了
    $("li:has(img)").mouseover(function() {
        $(this).children("img").attr("src",""));
    });
      

  4.   

    $("li:has(img)").mouseover(function() {
      $(this).children("img").attr("src",""));
    });
      

  5.   

    要mouseover和mouseout一起来哦。
      

  6.   


    第一个在鼠标放上去的时候，设置验色红，离开再设置原始验收
    更换图片就更换src或是用background-image也可以
      

  7.   

    <%@ page language="java" pageEncoding="GBK"%>
    <%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"%>
    <%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>
    <%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic"%>
    <%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%>
    <html:html>
      <head>
        <meta content="text/html; charset=GBK" http-equiv="Content-Type">
        <script type="text/javascript" src="${pageContext.request.contextPath }/scripts/jquery.js"></script>
        <title>index</title>
    <script type="text/javascript">
    $(function(){
    $("ul li ul").hide();
    $("ul li").bind("mouseover",function(){
    $("ul li").hover(function(){
    $("#myPic").attr("src","${pageContext.request.contextPath }/images/red.jpg");
    $(this).children("ul").show();
    },function(){
    $("#myPic").attr("src","${pageContext.request.contextPath }/images/blue.jpg");
    $(this).children("ul").hide();
    });
    });
    $("ul li ul").bind("mouseover",function(){
    $("#myPic").attr("src","${pageContext.request.contextPath }/images/blue.jpg");
    });
    });
    </script>
    </head>
    <body >
    <ul>
         <li><img id="myPic" src='${pageContext.request.contextPath }/images/blue.jpg'>
            <ul>
               <li>111</li>
                <li>222</li>   
             </ul>
         </li>
         <li></li>
         <li></li>
     </ul>
    </body>
    </html:html>这样是能满足你的要求，图片你自己换两个。