fadeToggle子元素 [英] fadeToggle child elements

问题描述

fadeToggle无法正常运行.

fadeToggle is not working as I expected it to.

这是一个示例小提琴: http://jsfiddle.net/JNu2q//

here is a sample fiddle: http://jsfiddle.net/JNu2q//

我需要做的是让更多元素淡入，但所有子元素

what I need to do is have more the element fade in, but all of the child elements

 <div id="happenings">
    <h3>Clicky<span class="ui-icon ui-icon-circle-triangle-e"></span></h3>
     <span class="ui-helper-hidden"><div class="more"> yadada</div></span>
    <h3>Clicky<span class="ui-icon ui-icon-circle-triangle-e"></span></h3>
        <span class="ui-helper-hidden">THINGS</span>
             <h3>Clicky<span class="ui-icon ui-icon-circle-triangle-e"></span></h3>
        <span class="ui-helper-hidden"">THINGS</span>
</div>
<script type="text/javascript">
$('#happenings>h3').click(function() {

   $(this).next('span').fadeToggle()
    $('span', this).toggleClass('ui-icon-circle-triangle-s'); 
}); 
</script>

小提琴在单击时会显示第一项，但单击不会扩大，也不会收缩.

as the fiddle shows the first item when click expands but doesn't fade in nor does in contract.

这是我正在尝试做的高度缩小的版本.我正在通过ajax将配置文件加载到每个配置文件中.跨度内还有其他一些元素.因此扩大和收缩.简而言之，我需要使span和它的子div淡入.

This is a highly scaled down version of what I am trying to do. I am loading profiles into each via ajax. inside the span is some other elements. so of which expand and contract. In short, I need the span and its child div to fade in.

谢谢

推荐答案

这是您的罪魁祸首

<div class="more"> yadada</div>

似乎具有块显示的div正在淡入.如果将其更改为跨度

It looks like the div having a block display is messing with the fade in. If you change it to a span

<span class="more"> yadada</span>

或将其显示为内联(或内联块)

or set it's display to be inline (or inline-block)

<div class="more" style="display:inline;"> yadada</div>

然后它起作用.

这篇关于fadeToggle子元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！