2010-05-31 5 views
1

jQuery주기 플러그인을 사용하여 단일 슬라이드에 여러 개의 슬라이드 쇼를 만들었습니다 (이 문제가 발생하면 마우스를 가리키면 시작/중단됩니다.) 페이지에는 9 개의 슬라이드 쇼가 있음).여러 jQuery 슬라이드 슬라이드 쇼가 겹쳐졌습니다

문제는 순환 게재를 위해 하나 이상의 슬라이드 쇼를 말할 때 순환 (겹쳐 표시)되는 항목이 둘 중 하나입니다. 그래서 슬라이드 1의 모든 이미지가 겹쳐서 슬라이드 2로 전환됩니다. 각 슬라이드 쇼의 첫 슬라이드에 투명한 PNG가 포함되어 있기 때문에 두 이미지가 겹쳐져 있다고 말할 수 있습니다.

jQuery each() 이터레이터에서 cycle()을 호출하든, 아니면 jQuery id selector가있는 컨테이너 중 2-3 개에서만 수동으로 호출하든 상관 없습니다.

답변

1

그냥 CSS이 추가 : 사이클 플러그인 position: relative 또는 position: absolute 중 하나가 있습니다 첫 번째 부모 요소와 관련 될 슬라이드 쇼에 absolute 위치를 설정하는 것입니다

.column { position: relative } 

. 따라서 .column 클래스에 position: relative을 설정하면 해당 슬라이드는 0,0 좌표의 슬라이드 쇼를 포함하고 서로 겹치지 않게됩니다.

+0

정말 고마워요! 귀하의 제안은 완벽하게 작동했습니다. CSS 그리드의 배치에 대해 다소 신경이 쓰이지 만, 래퍼 div를 슬라이드 쇼에 추가하고 위치를 적용했습니다. Firefox에서 잘 작동합니다. – gmorehouse

관련 문제