Question

美好的一天

由于某种原因，浏览器忽略了我的addClass和toggleClass jquery调用：

HTML

<div id="menuNav" class="row-fluid">
    <div id="menuNavSub" class="span12">
        <ul>                         
            <li id="homeNav"><a href="index.aspx"><img src="images/homeNav2.png" /></a></li>
            <li id="galleryNav"><a href="galleries.aspx" class="block"><img src="images/homeNav2.png" /></a></li>
            <li id="aboutNav"><a href="about.aspx"><img src="images/homeNav2.png" /></a></li>               
            <li id="contactNav"><a href="contact.aspx"><img src="images/homeNav2.png" /></a></li>
        </ul>              
    </div>         
</div>

CSS：

.activeNavHome1 {
    background-position: -200px center;
}

.activeNavHome2{
    background: url('/images/homeNavSmall.png') no-repeat left center;
    background-position: -150px center;
}

jQuery的：

    $('#homeNav').addClass('activeNavHome1');

    if ($(window).width() < 1080) {
       $('#homeNav').toggleClass('activeNavHome2');
     }

注意：我使用的是ASP.NET，jQuery代码包含在我的index.aspx文件中。 HTML包含在我的主文件中。

然而，当我使用

时

$('#homeNav').css('background-position', '-200px center')

有效。为什么不使用addClass和toggleclass命令分配我的类？我的CSS中没有拼错错误。

Answer 1

改为传递两个类i think you didn't referenced a jQuery library或者可能缺少doc ready：

<script>
  $(function(){ // <-----------------------------you are missing this
     $('#homeNav').addClass('activeNavHome1');
     if ($(window).width() < 1080) {
       $('#homeNav').toggleClass('activeNavHome1 activeNavHome2');
     }
   });
 </script>

注意：

确保在此脚本之前加载了jQuery：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

jQuery addclass和toggle类没有设置我的类

HTML

CSS：

jQuery的：

1 个答案:

注意：