Question

我正在尝试创建一种类似手风琴的效果。但是，当单击标题“A”以关闭/最小化它时，它下方的标题“B”移动得太靠近它。如果再次单击页面上的任何位置，标题会再次展开。

这是我的javascript：

        $(".accordion .head").click(function () {

            if ($(this).next().is(":visible")) {
                $(this).next().hide('fast');
                $(this).find('img').attr('src', '<%=Url.Content("~/Content/images/Arrow-Right.png")%>');
            }
            else {
                $(this).next().show('fast');
                $(this).find('img').attr('src', '<%=Url.Content("~/Content/images/Arrow-Down.png")%>');
            }
            return false;
        });

HTML看起来与此类似：

<div class=accordion>
   <h5 class=head> <img/></h5>
   <div> </div>
   <h5 class=head> <img /></h5>
   <div> </div>
</div>

我可以做些什么来阻止标题元素在隐藏它下面的div之后跳转？

Answer 1

使用css属性：display：inline-block。到你的标题类

Answer 2

似乎我已经改变了某些东西（或者可能有浏览器更新）来解决这个问题。

我看不到任何应该解决问题的改变。

元素在jQuery.hide（）之后跳来跳去

2 个答案: