2

ページ遷移を追加しようとしています。フェードイン遷移は、WebFontローダーとCSSアニメーションを使用して行われます。リンクをクリックしてタグにクラスを追加し、html1秒待ってから(CSSのfadeOutアニメーションの場合)、リンクにリダイレクトします。

これは、このjQueryコードの変更バージョンです。

$(document).ready(function() {

  $("a").click(function(event){
    event.preventDefault();
    redirectLink = this.href;
    $("body").fadeOut(1000, redirectToLink);      
  });

  function redirectToLink() {
    window.location = redirectLink;
  }
});

カスタマイズしましたが、問題が.delay(1000, redirectToLink)あり、動作しないと思います。JSの知識があまりないので、よろしくお願いします。

$(document).ready(function() {


  $("a").click(function(event){
    event.preventDefault();
    redirectLink = this.href;
    $("html").addClass('wf-next').removeClass('wf-active wf-inactive wf-loading').delay(1000, redirectToLink);      
  });

  function redirectToLink() {
    window.location = redirectLink;
  }
});
4

2 に答える 2

4

.delay()はアニメーションで使用することを目的としていますが、アニメーションをcssトランジションに移動しました。代わりに、次のようにsetTimeoutを使用します。

  $(document).ready(function() {

    $("a").click(function(event){
      event.preventDefault();
      redirectLink = this.href;
      $("html").addClass('wf-next').removeClass('wf-active wf-inactive wf-loading');
      setTimeout(function(){
        redirectToLink(redirectLink);
      }, 1000);
    });

    function redirectToLink(url) {
      window.location = url;
    }
  });
于 2012-07-06T17:13:24.703 に答える
0

これを試して:

  $(document).ready(function() {


    $("a").click(function(event){
      event.preventDefault();
      redirectLink = this.href;
      $("html").addClass('wf-next').removeClass('wf-active wf-inactive wf-loading').fadeIn(1000, function(){ redirectToLink(redirectLink) } );      
    });

    function redirectToLink(url) {
      window.location = url;
    }
  });
于 2012-07-06T17:07:59.113 に答える