모든 이미지가로드 될 때까지 궤도 슬라이더 이미지 숨기기

Question

파운데이션 5의 궤도 슬라이더를 사용하고 있습니다. 정상적으로 작동하지만 페이지가 처음 플래시를로드 한 다음 슬라이더에로드됩니다. 이미지가 모두로드 될 때까지 이미지를 숨길 수있는 방법이 있습니까?

HAML

.row 
    .medium-4.large-5.columns 
    %ul.example-orbit{"data-orbit" => ""} 
     - Cms::File.for_category('founder-carousel').each do |file| 
     %li 
      .slide= image_tag(file.file.url) 
      .orbit-caption= file.description 

Answer 1

궤도는 onReady 이벤트가 있습니다. visibility:hidden으로 기본 클래스를 설정할 수 있습니다 (표시되지 않지만 여전히 문서 흐름의 일부가 될 것입니다). 준비가되면 visibility:visible으로 변경하십시오.

$("#myOrbit").on("ready.fndtn.orbit", function(event) { 
    ... //your code here 
});` 

당신이 카운터로 img 태그에 onload를 추가 할 수 있습니다 도움이되지 않습니다. 모든 궤도가로드되면 궤도를 표시하십시오.