0

指定されたDIVのみを移動するアニメーション関数を取得するのに問題があります。代わりに、ページ全体を移動します。下のリンクの「RSVP」をクリックすると、私が話していることがわかります。特定のID(つまり、.wrapと#header)のみを呼び出すように切り替えようとしましたが、何も実行されませんでした。ヘッダーをアニメーション化するだけで、他には何もスクロールしないようにするにはどうすればよいですか?

これが私のコードです。それだけではありませんが、フェード/スクロールプロパティを持つJQueryのみを含めました。

  $.ajax({
    type: "POST",
    url: "http://mktietheknot.com/wp-content/themes/Retro/rsvp-process.php",
    data: dataString,
    dataType: "json",
    success: function(data) {
      if ( data.status == 'pass' ) {
        $('#rsvp-form').fadeOut(function(){

          $('#rsvp-form').html('<div class="rsvp-received">' +data.response+ '</div>').fadeIn(1000);

        });

        myTimer = $.timer(2500,function(){

          $('#rsvp .rsvp-link').click();

        });

      }
      else {

        $('#rsvp-form').append('<div class="error">' +data.response+ '</div>');
        $('#rsvp .submit').fadeIn('500');
        console.debug(data);

      }
    }
  });

  return false;            

  });
});

  $('#nav-rsvp a').unbind();
$('#nav-rsvp a, .rsvp-link').click(function(){
  if ( $('.wrap').hasClass('open') ) {
  $('.wrap').animate({
  top: '-=115'
  }, 750, 'easeInOutCubic');
  $('.wrap').removeClass('open');
  } 
  else {
  $('.wrap').animate({
  top: '+=115'
  }, 750, 'easeInOutCubic');
  $('.wrap').addClass('open'); 
}
return false;
});

})(jQuery);

これが彼がCSSを称賛しているところです:

/* === Header Section === */
#header {
background:url(wp-content/themes/Retro/images/structure/body_bg.png) repeat-x scroll center bottom transparent;
padding: 0 0 13px;
position:fixed;
width: 100%;
z-index: 100;
}
#header .section_inn {
padding-top: 0;
background:url(http://mktietheknot.com/wp-content/themes/Retro/images/structure/body_bg_brown.png) repeat-x;
width: 100%;
height: 130px;
z-index: 1000;
}
#header .wrap {
background: none repeat scroll 0 0 transparent;
width: auto;
top:-115px;
}

みんなありがとう!

4

2 に答える 2

0

#headerでトップスタイルをアニメーション化してみてください。にアニメーション化する必要があります

#header {top:115px}
于 2013-03-19T17:34:34.560 に答える
0

偶然に修正を見つけました。私のJQueryファイルには、前の質問からの作業負荷がありました。(私の前の質問)を参照してください。ただし、wordpressテーマに付属しているデフォルトのjqueryファイルをいじっていたとき、それらのオンロードが少し異なっていることがわかりました。キックのためだけに交換してみたところ、修正されました。理由はわかりませんが、実際にそうなりました。

修正はに変更(function($){})(jQuery);されていました

jQuery.noConflict();
jQuery( document ).ready( function( $ ) {} );

于 2013-03-20T02:31:38.877 に答える