Как заставить этот фрагмент jQuery работать в Internet Explorer? - PullRequest
3 голосов
/ 22 апреля 2010

Если когда-либо было время ненавидеть IE, то это оно. Этот код начинается с поля с контентом. Когда кнопка нажата, поле должно выпасть и исчезнуть.

<html>
<script type="text/javascript" src="jquery.js"></script>
<script type='text/javascript'>

function Test()
{
  var item_height = $('#test').height();
  $('#test').height(0);
  $('#test').css('opacity','0');

  $('#test').animate({ height: item_height, opacity: '1' },400);
}

</script>
<body>
<!-- The div below holds the sample content -->
<div id="test" style='border: 1px solid black;'>
  Content<br>
  Content<br>
  Content<br>
  Content<br>
  Content
</div>
<!-- The button to test the animation -->
<br><br>
<div style='position: absolute; top: 150px; left: 10px;'>
  <button onclick='Test();'>Test</button>
</div>
</body>
</html>

Этот очень простой пример работает на Chrome, Safari и Opera. Но Internet Explorer? нет Нет .

Как я могу (если это возможно) исправить это, чтобы оно работало в IE?

Ответы [ 2 ]

5 голосов
/ 22 апреля 2010

Поскольку вам не хватает тега <head> и объявления типа документа, ваша страница отображается в режиме Quirks.Измените это

<html>

на это

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
1 голос
/ 22 апреля 2010

Я предполагаю, что вы имеете в виду, что в IE высота элемента не изменится. Высота элемента, похоже, не установлена ​​в 0 должным образом. Это работает в моем IE8, когда я меняю

$('#test').height(0);

до

 $('#test').height(1);

Я не знаю, почему это так. Документация о высоте () не упоминает никаких специфических особенностей IE.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...