JQuery: переключение нескольких вещей одним щелчком мыши (нуб) - PullRequest
0 голосов
/ 30 января 2010

Простите, я не люблю добавлять здесь вопросы для начинающих, но, увы, я застрял. Я пытаюсь переместить несколько вещей влево и за пределы экрана (включая фоновое изображение), эффективно переключая панель управления (#navCol) и увеличивая основную область (.

Работает нормально в Firefox, но не в IE. Я должен отметить, что я новичок с jQuery, но не с html / css, и текущая настройка css выглядит неприлично, но этого не избежать Я подозреваю, что мой jQuery неверен, потому что в IE каждый раз, когда я нажимаю на ссылку переключения, происходит только некоторая анимация. При повторном нажатии другие делают.

Если мне нужно что-то уточнить, пожалуйста, дайте мне знать, и спасибо заранее!

$('a#nav-toggle').click(function() {
  $('#navCol').toggle('slide',400);
  $('#main').toggleClass('mainLarge', 530);
  $('body').toggleClass('backgroundOffset', 500);
  return false;
});  

Это правильно? Вот HTML:

<body>
<div id="horNav">
<ul id="navigation">  
...
</ul> 
</div>
<div id="navCol">
Left Col
</div>
<div id="main" class="main"> 
Main Col
<a href="#" id="nav-toggle"><-></a>
</div> <!-- End main -->
</body>  

А вот и CSS:

body {
    background: #f1f1f1 url(/images/shadow.png) repeat-y top;
    background-position: 400px 0px;
}

.backgroundOffset{
    background-position: 55px 0px;
}

#navCol{
    background: #eaeaea;
    color: #000000;
    height:100%;
    left:0px;
    margin-right:40px;
    position:fixed;
    top:0;
    width:400px;
    padding-top: 70px;
}

.main{
    padding-left: 460px;
    padding-top: 100px;
    padding-right: 100px;
}

.mainLarge{
    background-position: 55px 75px;
    padding-left: 115px;
}

1 Ответ

1 голос
/ 30 января 2010

Какую версию jQuery вы используете? Эти методы не выглядят так, как будто имеют правильные параметры для jQuery 1.3+. Я думаю, что это будет больше похоже на:

$('a#nav-toggle').click(function() { 
  $('#navCol').slideToggle(400);
  $('#main').toggleClass('mainLarge'); 
  $('body').toggleClass('backgroundOffset'); 
  return false; 
});

Вы не можете указать скорость для переключения класса - у него есть класс или нет. Стандартный второй аргумент - это флаг, указывающий текущее значение, должно ли новое значение быть включено или выключено.

...