Почему я не могу постепенно исчезнуть эта строка таблицы в IE с помощью jQuery?
Я не могу заставить строку таблицы постепенно исчезать в IE. Это работает в Chrome, но не IE. Это просто становится действительно 'легким' и остается на экране. Я попробовал IE8 и без режима эмуляции.
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function hideIt()
{
$('#hideme').fadeTo("slow", 0.0);
}
</script>
</head>
<body>
<table>
<tr id='hideme'>
<td>Hide me!</td>
</tr>
</table>
<button onclick='hideIt();'>Hide</button>
</body>
</html>
Существует ли обходное решение/решение для гладкого, исчезают?
2 ответа
Да, это ошибка (особенность?) в IE. Если вы примените его к элементам td вместо tr, вы получите желаемый эффект. So,
$('#hideme>td').fadeTo("slow", 0.0);
Вот что я в итоге сделал, и он работал неплохо во всем, хотя и довольно сложно (и с некоторыми ошибками - подробнее об этом через минуту - посмотрим, сможете ли вы его заметить):
function FadeInFrom(item,from_bg,from_fg,call)
{
$to_bg = $(item).css('background-color');
$(item).css('background-color',from_bg);
$to_fg = $(item + '>td').css('color');
$(item + '>td').css('color',from_fg);
var anim = {};
anim['backgroundColor'] = $to_bg;
$(item).animate(anim,'slow');
var anim2 = {};
anim2['color'] = $to_fg;
$(item + '>td').animate(anim2,'slow');
}
Это позволяет получить текущий цвет элемента, а затем анимирует его в этот цвет из указанных цветов.
Что касается этой ошибки, если вы попробуете приведенный выше код, вы заметите, что ссылки и другие элементы DOM могут быть некорректно анимированы из-за этого. Я оставляю это на усмотрение кого-то, чтобы попытаться найти решение для этого.