Jquery 当父样式=X时淡入元素

Jquery 当父样式=X时淡入元素,jquery,Jquery,我的主页上有一个带标记的滑块,所以 <li id="fragment-3" class="slides virtualsation ui-tabs-panel ui-tabs-hide" style="display: list-item;"> <h1>Virtualisation</h1> <p>By implementing virtualisation into Cou

我的主页上有一个带标记的滑块,所以

       <li id="fragment-3" class="slides virtualsation ui-tabs-panel ui-tabs-hide" style="display: list-item;">
              <h1>Virtualisation</h1> 
              <p>By implementing virtualisation into  Council  managed to save them over £250,000 in annual expenditure.</p>
              <div class="animation">
                    <div class="big-server"><img src="_includes/images/sliders/big-server.png"></div>
                    <div class="arrow"><img src="_includes/images/sliders/arrow.png"></div>
                    <div class="small-server-one"><img title="Title Text Blah" src="_includes/images/sliders/small-server.png"></div>
                    <div class="small-server-two"><img title="Title Text Blah" src="_includes/images/sliders/small-server.png"></div>
                    <div class="small-desktop"><img title="Title Text Blah" src="_includes/images/sliders/small-desktop.png"></div>
              </div>
        </li>
  • 虚拟化 通过在Council中实施虚拟化,他们每年节省了超过250000英镑的开支

  • 我希望当父li具有“显示:列表项”的内联样式时,动画元素中的每个子元素都淡入淡入

    使用jQuery可以做到这一点吗


    我考虑过使用.nestest(),但我不确定如何使用内联样式来定位div

    如果我理解正确的话,这样的方法会奏效:

    var hasInlineListItem = $('#whatever').closest('li').is(function () {
        return this.style.display == 'list-item';
    });
    
    if (hasInlineListItem) {
        //do whatever you want
    }
    


    jQuery有几个可供使用的选项。我在这里使用了,它将返回一个布尔值。

    如果您向我们展示将显示更改为列表项的时间和方式,将使它变得更容易

    您可以查看jquery函数$.Deffered,并将其附加到更改li元素显示的方法。这样,您就可以在以后创建一个函数来侦听,而不是将显示设置为list item或not

    也可以在定义li显示的方法中设置动画,如下所示:

    由于它是一个滑块,我假设当按下箭头时它会改变,并且您显示给我们的列表项是其他滑块中的一个


    希望这能对你有所帮助。如果上面的例子没有解决您的问题,那么我不太确定您如何处理从不是列表项到列表项的转换。无论如何,希望能有所帮助。

    这是由jQueryUI选项卡小部件驱动的吗?如果很容易绑定到选项卡事件
    // when you click next
    $('.arrow-next').on('click', function(){
    
        // hides the current, sets the next to list-item and caches the 'next' li
        var nextLi  = $('li.current').css('display','hidden').next('li').css('display','list-item')
    
        // fades in every element in the div.animation that is within the 'next' li element
        $('div.animation *', nextLi).fadeIn()
    
    
    })