为什么这个jquery代码只在opera下运行而不是在firefox和chrome下运行?

时间:2013-12-21 02:55:43

标签: jquery html google-chrome firefox opera

简单并开始新界面:

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="./style/style.css" />
    <script src="./javascript/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            var color = $('#title_buttom').css('background-color');
            $('.title_all').mouseover(function(){
                var styles = {
                backgroundColor : '#FF0C55'};
                $('#title_buttom').css( styles );
            });
            $('.title_all').mouseout(function(){
                $('#title_buttom').css('background-color',color);
            });
        });​
    </script>
</head>
<body>
    <div id='all_div'>
        <div id='master'>
            <div id='title_top'>
                <div id='title_home' class='title_all'>Home</div>
                <div id='title_info' class='title_all'>Info</div>
                <div id='title_project' class='title_all'>Projects</div>
                <div id='title_contectus' class='title_all'>Contect us</div>
            </div>
            <div id='title_buttom'></div>
        </div>
    </div>

</body>
    </html>

出于同样的原因我不知道为什么只有Opera浏览器可以使用这个代码而firefox和chrome不能。这是为什么?

link to the css file

1 个答案:

答案 0 :(得分:0)

试试这个

$(document).ready(function () {
    var color = $('#title_buttom').css('background-color');
    $('.title_all').on('mouseover',function () {
        var styles = {
            backgroundColor: '#FF0C55'
        };
        $('#title_buttom').css(styles);
    });
    $('.title_all').on('mouseout',function () {
        $('#title_buttom').css('background-color', color);
    });
});

您可以在此处尝试检查样式对象中使用backgroundColor而不是background-color是否存在问题。

$(document).ready(function () 
    {
    var color = $('#title_buttom').css('background-color');

    $('.title_all').on('mouseover',function () 
        {
            $('#title_buttom').css('background-color','#FF0C55');
        });

    $('.title_all').on('mouseout',function () 
    {
        $('#title_buttom').css('background-color', color);
    });
});