Как заставить эффекты jQuery работать в Firefox и Google Chrome?

Question

Я ковыряюсь с jQuery и эффектами fadeIn и fadeOut.У меня есть следующий код для отображения и скрытия div с сообщением.

`

<script type="text/javascript">
    $(document).ready(function() {

        $("button").click(function() {
            $("#upd").fadeIn(3000);
            $("#upd").fadeOut(20000);
        });

    });
</script>

<style type="text/css">
    div
    {
        background: rgb(237, 243, 254);
        margin: 0px 0px 5px 0px;
        padding: 13px 30px 13px 30px;
        width: 300px;
    }
</style>

`

Это отлично работает в Internet Explorer, но ничего не делает в Chrome, и я получаю поведение "показывать и скрывать" в Firefox.

Есть ли специальный шаг для того, чтобы эта библиотека работала равномерно или, по крайней мере, близко ко всем браузерам?

Answer 1

Попробуй Затухание из обратного вызова фадеИн.Это гарантирует, что последний эффект будет запущен после завершения первого, а не во время:

$(document).ready(function(){
  $("button").click(function(){
    $("#upd").fadeIn(3000,function(){
      $(this).fadeOut(2500);
    });
  });
});

jQuery - jQuery - запрос следует работает почти одинаково во всех браузерах сам по себе.Если вы получаете странное поведение, вы, скорее всего, делаете что-то неправильно - не jQuery :)

Answer 2

Во-первых, убедитесь, что вы используете последнюю версию jQuery и что Javascript включен во всех ваших браузерах.

Во-вторых, попробуйте связать цепочку fadeIn и fadeOut призывает вместе:

$("button").click(function() {
    $("#upd")
        .fadeIn(3000)
        .fadeOut(20000);
});

Answer 3

Вот в чем проблема:$("кнопка")

Такого элемента, как button, нет, если это класс, то:$('.кнопка')

...и если это идентификатор, то:$('#кнопка')