Разновидность ошибки jQuery fadeTo в IE - PullRequest
Новая
       30

Разновидность ошибки jQuery fadeTo в IE

1 голос
/ 08 июня 2011

Вдохновленная статьей, которую я прочитал вчера, я пытаюсь добавить пасхальное яйцо Konami, кодируемое кодом, на мой веб-сайт портфолио . Все началось с веселья, но, как и в случае с IE, казалось бы, довольно простая задача стала чем-то вроде несчастья!

Используя превосходный плагин jqPuzzle , идея заключается в том, что после ввода пользователем кода содержимое страницы исчезает и заменяется ранее невидимой интерактивной головоломкой-слайдером. Плагин, который я использую, применяется к изображению на странице через значение класса. Вот где он начинает усложняться: (предположительно), поскольку для загрузки плагина требуется некоторое время, а также потому, что плагин загружается только тогда, когда изображение видимо, я собрал следующий jQuery, чтобы сначала скрыть изображение, затухание это незаметно, чтобы дать плагину возможность загрузить, а затем снова исчезнуть изображение: 

<div id="eegg">
    <img src="images/photo_name.jpg" />
</div>

...

<script type="text/javascript">
    $( init );
    function init() {
        $('#eegg img').addClass( 'jqPuzzle jqp-r3-c4-NC' ); //Puzzle settings
        $('#eegg').hide().fadeTo( 'slow', 0.000001 ).fadeOut( 'slow' );
        $('#eegg img').addClass( 'positioned' ); //Centres puzzle in browser
    }

Увы, хотя этот небольшой обходной путь очень хорошо подходит для своих целей в Firefox и Chrome, IE 7 и 8 игнорируют инструкции для затухания и просто сбрасывают изображение с полной непрозрачностью, прежде чем удалить его через мгновение. Бешенство!

Может ли кто-нибудь предложить мне какое-либо руководство относительно того, как уговорить IE затухать в загадке?

В качестве альтернативы, есть ли лучший способ заставить слайдер JS загружать «невидимо»?

Ответы [ 2 ]

0 голосов
/ 08 июня 2011

Все, что вам нужно, это добавить эту опцию, чтобы перетасовать ее немедленно:

shuffle: true

0 голосов
/ 08 июня 2011

Вы проиграли, устанавливаете имя класса и ждете, когда плагин подхватит его.Лучше всего использовать синтаксис jQuery для головоломки: 

$('#eegg img').jqPuzzle({
    rows: 3,
    cols: 4,
    numbers: false,
    controls: {
        toggleNumbers: false
    }
});

Меня не удивит, если вам не понадобится затухание с этим.

...