cHl Security Ответов: 1

Как я могу решить эту проблему анимации javascript?


Я пытаюсь использовать setTimeout, чтобы показать / скрыть элемент после определенного времени, но он не работает.

Пожалуйста, см. код здесь
Ссылка на код

Что я уже пробовал:

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="connecting">Connecting...</div>
<div id="exchanging">Exchanging Private Token HandShake...</div>
<div id="access">Access Authorization Received!!!</div>
<div id="process">Looking up Availability</div>
<div id="phrazing">Phrazing Detection...</div>
<div id="processing">Processing Phrazed Detections...</div>
<div id="exporting">Exporting...</div>
<div id="redirecting">Redirecting...</div>


 <script type="text/javascript">
   $(function(){
showProcessing();
function showConnecting() {
  $('#connecting').show();
 setTimeout(function(){ hideConnecting();}, 30000);
}
function hideConnecting() {
  $('#connecting').hide();
   showPhrazing();
}
function showExchanging() {
  $('#exchanging').show();
  setTimeout(function(){ hideExchanging();}, 30000);
}
function hideExchanging() {
  $('#exchanging').hide();
  showExporting();
}
function showAccess() {
  $('#access').show();
  setTimeout(function(){ hideAccess();}, 30000);
}
function hideAccess() {
  $('#access').hide();
  showRedirecting();
}
function showProcess() {
  $('#process').show();
  setTimeout(function(){ hideProcess();}, 30000);
}
function hideProcess() {
  $('#process').hide();
  showRedirecting();
}
function showPhrazing() {
  $('#phrazing').show();
  setTimeout(function(){ hidePhrazing();}, 30000);
}

function hidePhrazing() {
  $('#phrazing').hide();
  showRedirecting();
}
function showProcessing() {
  $('#processing').show();
  setTimeout(function(){ hideProcessing();}, 30000);
}
function hideProcessing() {
  $('#processing').hide();
  showRedirecting();
}
function showExporting() {
  $('#exporting').show();
  setTimeout(function(){ hideExporting();}, 30000);
}
function hideExporting() {
  $('#exporting').hide();
  showRedirecting();
}
function showRedirecting() {
  $('#redirecting').show();
  setTimeout(function(){ hideRedirecting();}, 30000);
}
function hideRedirecting() {
  $('#redirecting').hide();
  setTimeout(function(){window.location = "export.html";}, 1000);
}
});
 </script>


Большая помощь будет очень признательна.

1 Ответов

Рейтинг:
1

F-ES Sitecore

Вам не нужен тег "script"в разделе JS, так что уберите его. Ваш таймер для первого процесса установлен на 30 секунд, вы уверены, что ждете 30 секунд? Уменьшите его до чего-то вроде "3000" для тестирования. Все ваши дивы видны и останутся таковыми, поскольку их ничто не скрывает, поэтому ваш код просто делает видимыми вещи, которые уже видны. Добавьте атрибут

style="display:none;"


для всех ваших дивов.