Javascript 鼠标移出并更改背景标记

在母版页中

脚本：

         $(".RightMenu").click(function(){ 

                $(".FlashMenu").css('background-image','url(icon/PersonalPage/blueFlash30.png)');   
                $('.RightMenu').css('background-image','url(icon/PersonalPage/Menu.png)');                

                $(this).css('background-image','url(icon/PersonalPage/MenuActive.png)');
                $(this).css('background-repeat','repeat-x');

                $(this).find(">:first-child").css('background-image','url(icon/PersonalPage/greenflash30.png)');
                $(this).find(">:first-child").css('background-repeat','no-repeat');  



         });
         $(".RightMenu").mouseover(function(){ 

                $('.RightMenu').css('background-image','url(icon/PersonalPage/Menu.png)');                

                $(this).css('background-image','url(icon/PersonalPage/MenuOver.png)');
                $(this).css('width','150px');
                $(this).css('height','20px');
                $(this).css('background-repeat','repeat-x');                        

         });

风格：

    div.RightMenu
    {
        background-repeat: no-repeat;
        text-align: right;
        cursor: pointer;
        height: 20px;
        float: right;
        width: 150px;
        background-image: url(icon/PersonalPage/Menu.png);
        border: 1px solid #ede7da;
    }
    div.FlashMenu
    {
        background-image: url(icon/PersonalPage/blueFlash30.png);
        background-repeat: no-repeat;
        float: left;
        width: 30px;
        height: 20px;
    }

HTML:

家
关于
产品

====================================================== 一,

当鼠标移动到

Div.RightMenu

上时，更改其图像（Menu.png==>MenuOver.png）

但是当鼠标从

div.ContentRightMenu

中移出时，

div.RightMenu

中的一种颜色与鼠标上方的颜色（MenuOver.png）保持不变，而不是第一种情况（Menu.png）

二,

---

当我点击一个

Div.RightMenu

时，它的默认颜色（Menu.png）将随着新状态（MenuActive.png）的改变而改变，但当鼠标移动时，颜色将返回到初始状态（MenuActive.png==>Menu.png）

尝试使用mouseout而不是mouseover

我认为您必须使用bind/unbind jQuery函数。此外，您还必须使用developerdoug提到的mouseout事件

function rightMenuClick()
{
    $(".FlashMenu").css('background-image','url(icon/PersonalPage/blueFlash30.png)');   
    $(".RightMenu").css('background-image','url(icon/PersonalPage/Menu.png)');   
    $(".RightMenu").bind('mouseover', rightMenuMouseOver);
    $(".RightMenu").bind('mouseout', rightMenuMouseOut);                
    $(this).css('background-image','url(icon/PersonalPage/MenuActive.png)');
    $(this).css('background-repeat','repeat-x');
    $(this).find(">:first-child").css('background-image','url(icon/PersonalPage/greenflash30.png)');
    $(this).find(">:first-child").css('background-repeat','no-repeat');     
    $(this).unbind('mouseout');
    $(this).unbind('mouseover');
}           
function rightMenuMouseOut()
{               
    $(this).css('background-image','url(icon/PersonalPage/Menu.png)');                              
}           
function rightMenuMouseOver()
{           
    $(this).css('background-image','url(icon/PersonalPage/MenuOver.png)');              
}                   
$(".RightMenu").bind('click', rightMenuClick);       
$(".RightMenu").bind('mouseover', rightMenuMouseOver);
$(".RightMenu").bind('mouseout', rightMenuMouseOut);

---

非常非常感谢你。

function rightMenuClick()
{
    $(".FlashMenu").css('background-image','url(icon/PersonalPage/blueFlash30.png)');   
    $(".RightMenu").css('background-image','url(icon/PersonalPage/Menu.png)');   
    $(".RightMenu").bind('mouseover', rightMenuMouseOver);
    $(".RightMenu").bind('mouseout', rightMenuMouseOut);                
    $(this).css('background-image','url(icon/PersonalPage/MenuActive.png)');
    $(this).css('background-repeat','repeat-x');
    $(this).find(">:first-child").css('background-image','url(icon/PersonalPage/greenflash30.png)');
    $(this).find(">:first-child").css('background-repeat','no-repeat');     
    $(this).unbind('mouseout');
    $(this).unbind('mouseover');
}           
function rightMenuMouseOut()
{               
    $(this).css('background-image','url(icon/PersonalPage/Menu.png)');                              
}           
function rightMenuMouseOver()
{           
    $(this).css('background-image','url(icon/PersonalPage/MenuOver.png)');              
}                   
$(".RightMenu").bind('click', rightMenuClick);       
$(".RightMenu").bind('mouseover', rightMenuMouseOver);
$(".RightMenu").bind('mouseout', rightMenuMouseOut);