Question

下面是代码：

$('span.faqanswer').hide();
$('strong.faqlink').css('cursor','pointer').click(function(){
    $(this).parent().find('span.faqanswer').slideToggle();
});

如果单击span.faqlink，它只是切换而不是滑动眼镜。如果你再次点击它滑动眼镜。这在任何过程中都会发生。下滑只是翻转和滑坡滑动......

Answer 1

jQuery的动画依赖于具有height和width的元素。由于span是一个内联元素，因此它没有设置或设置这些维度，因此动画不起作用。

在向上滑动时有效，因为显示设置为inline-block并且可以设置动画。

我建议你将span打包在div中，然后在div下滑动，以便更改标记。

工作演示 - http://jsfiddle.net/ShankarSangoli/yTeAY/

Answer 2

首先尝试$('span.faqanswer').slideUp();而不是$('span.faqanswer').hide();。

http://jsfiddle.net/RbpAq/

首先为span.faqanswer元素display:none添加样式，然后删除$('span.faqanswer').hide();

http://jsfiddle.net/tFFX6/1/

Answer 3

如果您尝试水平放置元素幻灯片，请不要使用slideToggle()。使用animate()。

http://api.jquery.com/slideToggle/

.slideToggle（）方法可以设置匹配元素的高度。这会导致页面的下半部分向上或向下滑动，从而显示或隐藏项目。

否则，请按@ShankarSangoli说并包装内联元素。

jquery slideToggle（）not＆＃34; sliding＆＃34;但在外面

3 个答案: