Question

我正在设计一个联系表单，在发送时会弹出一条“谢谢”消息，我需要将我的感谢信息定位为相对，否则如果用户碰巧在动画运行时滚动消息仍然卡住到位并废弃动画。然而，假设div相对位置在加载之前将其保持在位置，我需要的是一种方式来显示div：none或opacity：0在按下发送按钮之前，这可能吗？

这是一个http://jsfiddle.net/gcQ8f/来解释我正在努力实现的目标

以下是我正在使用的Javascript

$(document).ready(function(){
$(".send-button").click(function(){

$("#contact-form") .delay(1000) .animate({ height:'toggle', opacity:'toggle' }, (400));

$("#contact-form") .delay(3000) .animate({ height:'toggle', opacity:'toggle' }, (400));
$(".contact").reset();
});
});

任何帮助都会非常感激：）

谢谢你们！

Answer 1

只需为您的DIV分配ID或类（例如id="myThankYouDIV"），然后在CSS中使用display: none隐藏它。然后，当您准备好显示它时（单击按钮时），只需致电$('#myThankYouDIV').show() $('#myThankYouDIV').fadeIn()。

编辑：我想我误解了你的问题。想要在动画完成后显示“谢谢”消息，对吧？您仍然需要使用CSS隐藏它，但要显示它只是这样做：

$("#contact-form") .delay(3000) .animate(
    { height:'toggle', opacity:'toggle' },
    400,
    function(){
        // animation is complete
        $('#myThankYouDIV').fadeIn();
    }
);

使用Javascript隐藏相对div

1 个答案: