페이드 인 요소 = X

Question

나는 그래서 내 마크 업 내 홈페이지에 슬라이더를 가지고 ... 내가 부모 리튬가있을 때 페이드 내 애니메이션 요소의 각 아이를 원하는

 <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> 

디스플레이의 인라인 스타일 : list-item;

이것이 jQuery에서 가능합니까?

I하지만이 같은 작동 것이다

Answer 1

디스플레이를 목록 항목으로 변경하는시기와 방법을 알려 주시면 쉽게 적용 할 수 있습니다.

jquery 함수 $ .Deffered를 살펴보고 li 요소의 표시를 변경하는 메서드에 연결할 수 있습니다. 그렇게하면 나중에 표시를 수신하는 함수를 list-item로 설정했는지 여부를 나중에 확인할 수 있습니다.

아니면 리튬 디스플레이를 정의 그래서 같은 방법 내에서 애니메이션을 수 :

는 슬라이더이기 때문에

, 나는 그것이 화살표를 누르면 변경 가정 및 목록 항목은했습니다 있음 우리를 보여 주며, 다른 사람들 사이에 하나의 슬라이더입니다.

// 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() 


}) 

희망이 도움이 될 수 있습니다. 위의 예제가 문제를 해결하지 못한다면 목록 항목이 아닌 항목에서 목록 항목으로 전환하는 방법을 어떻게 처리해야하는지 잘 모르겠습니다. 어쨌든, 그것이 도움이되기를 바랍니다.

Answer 2

내가 제대로 이해하면 ... (.closest 사용)하지만 wwasnt 이드 인라인 스타일 사업부를 대상으로 방법을 잘 대해 :

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

if (hasInlineListItem) { 
    //do whatever you want 
} 

jsFiddle Demo to illustrate how it works을

jQuery에는 사용할 수있는 여러 가지 filter methods이 있습니다. 여기서는 is()을 사용했으며, 이는 부울을 반환합니다.