我无法让动画函数仅移动指定的 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;
}
多谢你们！