这是我第一次张贴在这里已经阅读了很多有用的东西在过去的几个星期以来我发现的网站!

因此,我的问题是:我有以下代码在我的网站上,我试图做的是...

  • 当一个单元(.btn-leavecomment)是点击,

  • 一个隐藏的div(#commenttype)揭示了通过slideDown.这个隐藏的div包含两个无线电按钮。

  • 上点击/选择的"第一个"无线电按钮(.reveal_ccform)我喜欢的另一个隐藏的div透露(我有这样的所有工作到这里的)

  • 我会再喜欢的第一个隐藏的div(其中包含的无线电按钮(#commenttype)),然后消失和淡出(一次用户选择只有第一个无线电按钮的两个。第二个无线电按钮,重定向到另一个网页的情况下,你都不知道。)

任何人都可以帮助获得最后这一点(以淡出的第一个隐藏的div)上点击的第一个无线电按钮吗?

谢谢你

我的代码:

$(document).ready(function(){

  // Click first element (.btn-leavecomment)
  // and reveal first hidden DIV (#commenttype)
  $(".btn-leavecomment").toggle(function(){   
        $("#commenttype").stop().animate({ down: "+=300" }, 3000)      
        $("#commenttype").stop().slideDown("slow");
   }, function(){
        $("#commenttype").stop().animate({ down: "-=300" }, 1400)      
        $("#commenttype").stop().slideUp("slow");  
  });     


  // on click of first radio (.reveal_ccform)     
  // Reveal second hidden DIV (ccform_container) 
  $(".reveal_ccform").toggle(function(){   
  $("#ccform_container").stop().animate({ down: "+=600" }, 6000)      
  $("#ccform_container").stop().slideDown("slow");    


  //fadeOut #commenttype onClick of .reveal_ccform after #ccform_container slidesDown


}); 
有帮助吗?

解决方案

我觉得我必须丢失的东西,因为这似乎是非常简单的比较,为什么你已经这样做,但在这里,你去:

$('.reveal_ccform').click(function() {
    $('#commenttype').fadeOut();
});

******编辑****

对于一个更顺畅、更复杂的动画作请求在以下评论,这样做:

$('.reveal_ccform').click(function() {
    $('#commenttype').animate({height: 0, opacity: 0}, function() {
        $(this).remove();
    });
});

这将创建一个自定义的动画淡出div含有的无线电按钮的话,同时降低高度为零,这将解决跳的问题。回呼功能消除div后画完成(不必要步骤,但保持DOM符合用户看见).

看到结果: http://jsfiddle.net/8bCAg/

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top