company 테마 배너 슬라이드 이미지 갯수 문의 드립니다.
본문
company 테마 상단에 배너 슬라이드가 이미지 하나로 실행되는데
이미지의 갯수를 늘리려면 어떻게 해야 하나요? css를 찾아보니 배경이미지로 돼 있는
부분을 찾아서 .bn_bg1 .bn_bg2 .bn_bg3 이렇게 css를 추가하여 봤지만
여전히 첫번째 이미지만 나오네요..갯술 늘리는 방법 아시면 부탁 좀 드리겠습니다.
답변 2
css 추가하고
index_head.php 파일도 수정하셨나요?
<li class="bn_bg1"> 이렇게 하나로 통일되어 있는데 여기도 수정해야 합니다.
네 index.php 에서도 class명 바꿔줬습니다만 첫번째 이미지만 나오고 두번째 세번째는 이미지 없이 왼쪽에 파란색 상자만 움직이며 슬라이드 되고 있네요..
css
#main_bn {background:#f1f1f1;position:relative;overflow: auto;width:100% !important; border:1px solid #CF0}
#main_bn .bn_ul li{height:645px;float: left;}
#main_bn li.bn_bg1{background:url(../img/m_visual_01.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg2{background:url(../img/m_visual_02.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg3{background:url(../img/m_visual_03.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
index.php
<div id="main_bn">
<ul class="bn_ul">
<li class="bn_bg1">
<div class="bn_wr">
<div class="bn_txt">
<h2>신뢰와 나눔속에 <br>사랑받는 기업으로</h2>
<p>우리의 원대한 도전,<br>새로운 100년이 깨어납니다</p>
</div>
</div>
</li>
<li class="bn_bg2">
<div class="bn_wr">
<div class="bn_txt">
<h2>신뢰와 나눔속에 <br>사랑받는 기업으로</h2>
<p>우리의 원대한 도전,<br>새로운 100년이 깨어납니다</p>
</div>
</div>
</li>
<li class="bn_bg3">
<div class="bn_wr">
<div class="bn_txt">
<h2>신뢰와 나눔속에 <br>사랑받는 기업으로</h2>
<p>우리의 원대한 도전,<br>새로운 100년이 깨어납니다</p>
</div>
</div>
</li>
</ul>
<div class="bn_btn">
<a href="#" class="unslider-arrow prev">Previous slide</a>
<a href="#" class="unslider-arrow next">Next slide</a>
</div>
</div>
index.php가 아니라 index_head.php 파일입니다. 직접 해봤는데 전 잘 되는데요?
css에 추가한 이미지 코드와 img 폴더에 추가한 이미지가 맞는지 체크하셔야 할 것 같네요.
아..제가 구조를 좀 바꿔서 index_head.php 에 있는 내용을 index.php로 옮겨서 작업하고 있습니다.
url을 올려보세요. 테마 기본 상태라면 테마 폴더 안의 img 폴더에 추가 이미지가 있어야 합니다.
제가 css 경로가 틀렸었네요..답변 감사드립니다.
#main_bn li.bn_bg1{background:url(../img/main_bn.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
밑에추가
#main_bn li.bn_bg2{background:url(../img/main_bn1.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg3{background:url(../img/main_bn2.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg4{background:url(../img/main_bn3.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
추가하시고 img폴더에
main_bn1.jpg
main_bn2.jpg
main_bn3.jpg
추가로 저장해서 올려보세요
답변 감사드립니다.^^
