jQuery fadein effect для перехода на другую страницу

Я пытаюсь установить страницу загрузки, и я установил таймаут на 5 секунд, прежде чем переходить на страницу index.html. Я хочу перейти на эту страницу с некоторыми основными изменениями в процессе перехода, и я хотел бы знать, как я могу это сделать?jQuery fadein effect для перехода на другую страницу

Мои в настоящее время код:

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
     <title> Go Post - HomePage </title> 
     <link rel="stylesheet" href="includes/style.css"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <script> 
      setTimeout(function(){ 
       window.location='index.html'; 
      }, 3000); 
     </script> 
    </head> 

    <body> 
     <div class="load"></div> 
    </body> 
</html>

источник

2016-02-12 drorAlfasi

Спасибо! Я сделал это так, как ты сказал. – drorAlfasi

Вы можете просто сделать это с помощью Jquery FADEOUT.

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
     <title> Go Post - HomePage </title> 
     <link rel="stylesheet" href="includes/style.css"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <!-- Import jquery --> 
     <script src="//code.jquery.com/jquery-1.12.0.min.js"></script> 
     <script> 
      setTimeout(function(){ 
       $('html').fadeOut(
        500, // animation time 
        function(){ 
         // action will do after the animation 
         window.location='index.html'; 
        } 
       ); 
      }, 3000); 
     </script> 
    </head> 

    <body> 
     <div class="load"></div> 
    </body> 
</html>

источник

2016-02-12 16:51:52

Попробуйте ниже

В HTML добавить DIV

<div id="preloader"> 
</div>

JQuery

$(function() { 

    setTimeout(function() { 
    $('#preloader').fadeOut('slow', function() { 
     window.location = "https://google.com"; 
    }); 

    }, 5000); 

});

CSS:

div#preloader { 
    background: url("http://www.mytreedb.com/uploads/mytreedb/loader/ajax_loader_blue_512.gif") no-repeat scroll center center #000000; 
    height: 100%; 
    position: fixed; 
    width: 100%; 
    z-index: 999; 
}

Демонстрация: http://codepen.io/anon/pen/gPqLPX

источник

2016-02-12 16:55:11 Thangaraja

jQuery fadein effect для перехода на другую страницу

ответ

Смежные вопросы