이 회전 배너의 탐색 버튼이 작동하지 않는 이유는 무엇입니까?

Question

홈 페이지에서 회전하는 이미지가 3 개 있습니다. 한 번에 하나의 이미지가 표시되며 첫 번째, 두 번째 또는 세 번째 이미지인지 여부를 나타 내기 위해 이미지 아래에 3 개의 도트가 있습니다.

도트는 클릭 할 수 있지만 실제로는 그렇지 않습니다.

.body, html {font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;font-weight:300;background:#fff; background: url('http://www.ayrturfandtrac.org/wp-content/uploads/2012/12/headerImage4.png');background-repeat:repeat-x;width:100%; margin:0; padding:0; } 

.container{ 
    margin:0; 
    padding:0; 
    width:100%; 
    height:100%; 

    background-color:#ffffff; 
} 

.header {max-height: 100px} 

.logo img {width:90%; min-height: 65px; max-width:400px; margin:0.5% 2% 1% 7%; float:left;} 

.recLogo img {max-height: 140px; margin:0.5% 2% 1% 7%; float:left;} 


.headlineContainer {display:block; width:80%; margin:0; position:relative; right:25%; font-weight:bold;} 
.headline {margin:0;} 

.nav {width:55%; margin:3.2% 0 0 0; float:left; max-height:100px} 

.nav ul {} 

.nav li {display:inline; height:30px; float:left; list-style:none; margin: 0 4.43668% 0 0;font-weight:bold} 

.menu li a {text-decoration:none; color:#000; font-family:helvetica, arial, sans-serif; font-weight:regular;} 

.menu li a:hover {color:#FFF} 

.menu {float:right; margin:0 5% 0 0} 

.current_page_item a:visited {color:#fff;} 

.white {background-color:#fff; background:url('http://www.ayrturfandtrac.org/wp-content/uploads/2012/12/headerImage4.png'); background-repeat:no-repeat; width:100%} 

.promos {clear:both; width:80%; display:block; padding:5% auto 0 auto; margin: 0 auto; background-color:#fff; position:relative;bottom:2em; z-index:-1} 

.rslides_tabs a { 
background:#fff !important; 
border: 2px solid !important; 
border-color:#cccccc !important; 
z-index:9 !important; 
} 

.rslides_tabs .rslides_here a { 
background: #EE7600 !important; 
border: 2px solid !important; 
border-color:#cccccc !important; 
z-index:9 !important; 
} 

페이지는 http://www.ayrturfandtrac.org/ 당신이이 세 개의 버튼을 해결하는 방법에 어떤 아이디어가 있습니까

에서 볼 수있다 : 여기

는 CSS입니까?

Answer 1

.promos 클래스의 z-index: -1이 블록이 포함 된 .white 뒤에 슬라이드 쇼를 밀어 넣고 클릭을 등록하지 않게하는 것이 맞습니다.

HTML 및 CSS 설정 방법을 다시 구성하여 "헤더"영역이 로고 및 탐색과 함께 빨간색 배경 및 그림자와 함께 자체 요소로 설정 될 수 있도록 설정해야합니다 z- 색인은 슬라이드 쇼 컨테이너보다 높습니다. 이렇게하면 슬라이드 쇼가 일반적인 Z- 인덱스로 유지되고, 머리말이 겹치지 않는 한 슬라이드 쇼의 크기보다 더 많은 슬라이드 쇼가 나타나면 클릭 기능이 작동합니다.