Question

我希望能够点击“是”或“否”并在第二组按钮出现之前没有点击另一个按钮幻灯片隐藏。

一旦隐藏动画开始，看起来未点击的按钮会包裹到下一行，我无法找出原因。

我们一如既往地感谢您的帮助。

Answer 1

您的按钮需要浮动：

HTML：

<div class="buttons">   

  <button class="response" id="r1">Yes</button>
  <button class="response" id="r2">No</button>

  <button class="result">Resolved</button>
  <button class="result">Not Resolved</button>

</div>

CSS：

.result{
   display:none;
}

button{
   /*display:inline;*/
   height:30px;
   float:left;
   margin-right:5px;
}

.buttons{
   width:100%;
   overflow:hidden;
}

jQuery的：

//$(function() {
    $('#accordion').accordion();
//});

$('.response').click(function() {
   var currentButton = "#" + this.id;

   $('.response').not(currentButton).hide("slide", { direction: "left" }, 200, function(){      
       $('.result').css("display","inline-block");      
       $(currentButton).css("background","dimgrey"); 
   }); 
});

正在运行示例：http://jsbin.com/fetux/1

jQuery隐藏幻灯片搞乱元素位置

1 个答案: