анимация не выполняется с использованием jquery на локальном сервере

#jquery #dom #settimeout #fadeout

#jquery #dom #settimeout #затухание

Вопрос:

Я использую FF8 и CHROME версии 33.0.1750.154 m. Проблема, с которой я сталкиваюсь, заключается в том, что я не могу скрыть div с эффектом затухания. Я знаю, что ранее другие задавали вопросы по этой теме (я даже опробовал их), но ни одно из решений не сработало для меня. Я не могу понять, где я ошибаюсь. Единственное, что сработало для меня, — это приведенный выше код. Но то, что я хочу, это эффект затухания. Пожалуйста, укажите на мои ошибки.

ОБНОВЛЕНИЕ: получение TypeError: $(…).fadeout не является функцией

в консоли firefox с помощью

  setTimeout(function(){$('#Layer4).fadeout(500);}4000);
  

пожалуйста, помогите.

     <html>
<head>

<style type="text/css">
#Layer4
{
background-color:#0099CC;
color:#FFFFFF;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:18px;
}
</style>

<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script type="text/javascript">
  

Комментарии:

1. $(function(){// matter of DOM ready I suppose });

2. @Amit Joki Да, сначала я пытался использовать document.ready, но безрезультатно.

3. Вы пробовали $('#Layer4').fadeOut(); ?

4. Да, вам не хватает DOM ready, но через 4 секунды dom, вероятно, будет готов. Ваша ссылка на jquery, скорее всего, неверна. Замените версией из CDN и посмотрите, работает ли она <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>

Ответ №1:

Я предполагаю, что вы просто неправильно ссылаетесь на jQuery. Попробуйте использовать ресурсы CDN, например:

 <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js">
  

И затем ваша функция fade выглядит следующим образом:

 <script type="text/javascript">
    $(document).ready(function(){
        setTimeout(function(){
            $('#Layer4').fadeOut(500);
        },4000);
    });
</script>
  

СКРИПКА: http://jsfiddle.net/mtyAZ /

Комментарии:

1. Он все равно должен быть обернут $(function(){});

2. Абсолютно. Я был ленив. Отредактировано соответствующим образом 🙂

3. @Popnoodles, я использую приложение на локальном сервере. Следовательно, я загрузил версию 1.10.4 и ссылался на указанные файлы, но все еще не работал.

4. @Ayan ваши ссылки неверны. Вы все равно можете (и должны) использовать cdn в любом случае.

Ответ №2:

хорошо, наконец-то проблема решена. Место, где я ошибался, было то, что я использовал

  fadeout
  

вместо

  fadeOut
  

ПРИМЕЧАНИЕ: я все еще использую локальные файлы js вместо прямых ссылок на CDN.
@Popnoodles, спасибо за ваши ответы и постоянную поддержку.

Ответ №3:

Попробуйте это:

 $(document).ready(function(){
  setTimeout(function(){
    $('#Layer4').hide(500);
  }, 4000);
}
  

Комментарии:

1. Добро пожаловать в Stack Overflow. Пожалуйста, старайтесь избегать ответов «попробуйте это» и публикуйте то, что, как вы уверены, работает. Также полезно объяснить разницу и почему она теперь работает.

2. Через 4 секунды dom, вероятно, будет готов. Хотя это правильный способ использования jQuery в заголовке документа, он не обязательно должен устранять проблему.