Непрозрачность анимации не работает в IE или Opera

Question

Я экспериментирую с плагинами jQuery. У меня есть этот код, чтобы исчезнуть в «лайтбоксе»:

$('#cleverbox')
    .css({ opacity:0, visibility:'visible' })
    .animate( {opacity:1}, 2000 );

Он отлично работает на Firefox и Chrome, но в IE (7 и 8) и Opera элемент просто появляется, а не исчезает. Есть несколько похожих вопросов по SO, но мне еще предстоит найти решение, которое работает .

У меня есть пример страницы . У меня также есть несколько других проблем:

1. В Internet Explorer (7 и 8) первая миниатюра никогда не отображает лайтбокс (событие onload никогда не срабатывает).
2. В IE7 код для исправления ошибки ClearType не работает. $(this).css( 'opacity', '' ) должен удалить стиль непрозрачности (в данном случае, свойство 'filter'), но не удаляет его. В инструментах разработки IE он все еще имеет style="filter: ;"
3. В Opera он никогда не запускается после однократной загрузки. Другими словами, если изображение находится в кэше браузера, событие onload никогда не запускается.

Answer 1

Я нашел исправление для ошибки в Opera, благодаря сообществу Opera. У меня было это:

var imgLoad = new Image();
imgLoad.src = linkUrl;
imgLoad.onload = function() {
    //do some stuff here
}

Однако, если изображение находится в кэше браузера, оно никогда не срабатывает, потому что часть загрузки предшествует функции загрузки. Решение состоит в том, чтобы переместить назначение src ниже функции загрузки:

var imgLoad = new Image();
imgLoad.onload = function() {
    //do some stuff here
}
imgLoad.src = linkUrl;

Answer 2

Вы пробовали оборачивать значения непрозрачности в ', т.е. $(something).animate({opacity:'1'});? У меня работает каждый раз.