Company 테마 PC 메인 슬라이딩 이미지 수정 예 > 그누보드5 팁자료실

그누보드5 팁자료실

Company 테마 PC 메인 슬라이딩 이미지 수정 예 정보

Company 테마 PC 메인 슬라이딩 이미지 수정 예

본문

theme/company/img
 
이미지 : 1444 × 647 px
 
 
theme/company/css/default.css
 
#main_bn li.bn_bg1{background:url(../img/Hashima_Island_01.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg2{background:url(../img/Hashima_Island_02.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg3{background:url(../img/Hashima_Island_03.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}
#main_bn li.bn_bg4{background:url(../img/Hashima_Island_04.jpg) no-repeat 50% 50%; background-size: cover;display: table;-ms-filter: sizingMethod='scale' property}

'bg1' 소스를 복사해서 아래에 삽입하고, 연번과 이미지 파일명을 수정해주는 방식입니다.
 
 
theme/company/index_head.php
 
    <div id="main_bn">
        <ul class="bn_ul">
            <li class="bn_bg1">
                <div class="bn_wr">
                    <div class="bn_txt">
                        <h2>Hashima Island  <br></h2>
                        <p>Native name: 端島<br>Nickname: Battleship Island</p>
                    </div>
                </div>
            </li>
            <li class="bn_bg2">
                <div class="bn_wr">
                    <div class="bn_txt">
                        <h2>Hashima Island  <br></h2>
                        <p>Native name: 端島<br>Nickname: Battleship Island</p>
                    </div>
                </div>
            </li>
            <li class="bn_bg3">
                <div class="bn_wr">
                    <div class="bn_txt">
                        <h2>Hashima Island  <br></h2>
                        <p>Native name: 端島<br>Nickname: Battleship Island</p>
                    </div>
                </div>
            </li>
            <li class="bn_bg4">
                <div class="bn_wr">
                    <div class="bn_txt">
                        <h2>Hashima Island  <br></h2>
                        <p>Native name: 端島<br>Nickname: Battleship Island</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>

전부 'bg1'으로 동일하게 되어있는 것을 연번을 수정하고, 내용도 달리하세요.
(저는 귀찮아 동일한 내용으로 했습니다만)

속도는 바로 아래의 스크립트 소스에서 적절히 조절하세요.
그리 부드럽게 되지는 않네요.
추천4

댓글 전체

메인 이미지 사이즈를 고정하고 싶습니다. 방법이 없을까요. 아무리해도 안되서요 ...,
현재 이미지 사이즈가  1033 * 761 픽셀입니다. 브라우저 및 모니터 해상도에 따라
이미지가 커졌다가 작아졌다 해서 도움을 청합니다.
전체 1,529 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 (06253) 서울특별시 강남구 도곡로1길 14, 6층 624호 (역삼동, 삼일프라자) 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT