2017-10-29 7 views
1

페이딩없이 상단에 헤더를 표시하여 슬라이드 쇼를 구현하려고합니다. 내가 누군가 물어봐 할 수없는 오전 슬라이드 쇼가 헤더 여기헤더를 숨기지 않고 슬라이드 쇼를 추가 할 수 없습니다.

에서 시작되도록 코드를 변경 나를 도와 나의 codepen

https://codepen.io/arunkayathi/pen/EbxpEv

#landing-header { 
    background-repeat: no-repeat; 
    background-size:100%; 
    z-index: 1; 
    position: relative; 
    width:340px; 
    height:174px; 
    text-align: center; 
    margin:0 auto; 
    padding-top: 37vh; 
} 
#landing-content{ 
    padding:40px 0; 
} 
#landing-header{ 
    color:white; 
} 
.slideshow { 
    position: fixed; 
    width: 100%; 
    height: 100%; 
    top: 0; 
    left: 0; 
    z-index: 0; 
    list-style: none; 
    margin: 0; 
    padding: 0; 
} 
.slideshow li { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    background-size: cover; 
    background-position: 50% 50%; 
    background-repeat: no-repeat; 
    opacity: 0; 
    z-index: 0; 
    animation: imageAnimation 50s linear infinite; 
} 

에 대한 링크 인을 클릭하십시오 링크를 찾아 전체 코드를 찾으십시오.

+0

이 추가, 당신은 매우 상단에있는 배너/탐색은 항상 계속 표시하고 싶지만 현재 슬라이드 변화 및 페이드 아웃된다? – Chris

+0

맞습니다. chris – arun

답변

1

nav 요소에 z- 색인을 추가하기 만하면됩니다. 내가 잘못 아니에요 경우

당신의 CSS를

nav { 
    z-index:10; 
}