[이윰] modal 창 크기 변경하기

페이지 정보

yadolee 루루아빠 3,742 2015.07.30 17:45:40

평점

  • 평점 : 0점 (0명 참여)

본문

갤러리 뷰에서 모달창과 게시판 문서 검색의 모달창의 크기를 조건에 맞게 반영한다.
그누보드5/eyoom/theme/설치된 테마/css/custom.css를 열고 아래 소스를 삽입한다.


.modal {
    position: fixed;
    top: 2%;
    right: 2%;
    left: 2%;
    bottom: 2%;
    width: auto;
    height: auto;
    margin: 0;
}

@media (min-width: 1200px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 400px;
        height: 230px;
    }
}

@media (min-width: 1002px) and (max-width: 1199px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 400px;
        height: 230px;
    }
}

@media (min-width: 768px) and (max-width: 1001px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 400px;
        height: 230px;
    }
}

@media (max-width: 767px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 300px;
        height: 230px;
    }
}
.modal-content {
    height: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}
.modal-body {
    height: auto;

}
.modal-title {
    margin-top: 0px
}
.modal-header .close {
  margin-top: 3px;
}
.modal-footer {
    text-align: left;
    padding: 11px;
}

게시판내 문서 검색시 사용하는 모달창 클래스 modal-sm 은 가로, 세로 크기를 고정했다.


 
추천인
  • 추천해 주세요
yadolee
6
루루아빠 - 회원등급 : 최고관리자 - 포인트 : 1,328,414
레벨 99
경험치 1,478,262

Progress Bar 77.32%

- 가입일 : 2015-03-04 03:24:54
- 서명 : KNOW YOUR LIMITS BUT NEVER STOP TRYING TO EXCEED THEM !!
- 자기소개 : 루루의 자랑 루루아빠랍니다~~

댓글

첫 번째 댓글을 남겨 주세요

Total 7592838 페이지
제목 글쓴이 날짜 조회 추천
이윰  🏆 Eyoom Builder 1.1.9 - 그누보드 5.1.0 테마버전 지원 루루아빠 2015.08.05 3,464 0
그누•영카트  🏆 그누보드5 최소 글수 제한 관리자와 특정레벨 예외로 하기 루루아빠 2015.08.05 3,019 0
이윰  🏆 갤러리 및 최신 갤러리에서 새로운 글 이미지 내에 표현하기 루루아빠 2015.08.04 2,959 0
그누•영카트  🏆 그누보드 5.1.0 패치 루루아빠 2015.08.03 2,766 0
이윰  🏆 🚩 modal 창 크기 변경하기 루루아빠 2015.07.30 3,743 0
이윰  댓글+1🏆 style.css를 유지하면서 venobox 플러그인 사용하기 루루아빠 2015.07.30 3,839 0
이윰  🏆 Eyoom Builder 1.1.8 추가 수정사항 루루아빠 2015.07.30 2,829 0
이윰  🏆 new 이미지를 출력하는 시간을 늘리기 루루아빠 2015.07.28 3,286 0
그누•영카트  🏆 영카트 5.0.43 패치 루루아빠 2015.07.27 2,724 0
그누•영카트  🏆 그누보드 5.0.42 패치 루루아빠 2015.07.27 3,011 0
이윰  댓글+1🏆 dropdown menu 펼쳐지는 위치 조정하기 루루아빠 2015.07.24 4,352 0
이윰  🏆 Eyoom Builder 1.1.8 패치 루루아빠 2015.07.24 3,124 0
이윰  🏆 이모티콘을 이윰빌더에 적용하기 위한 규칙 루루아빠 2015.07.23 3,023 0
이윰  댓글+1🏆 이모티콘 크기 바꾸기 루루아빠 2015.07.23 3,115 0
그누•영카트  🏆 접속자 관리에서 브라우저와 OS 종류를 추가해보자 루루아빠 2015.07.20 3,438 0
그누•영카트  🏆 영카트 5.0.42 패치 루루아빠 2015.07.20 3,425 0
그누•영카트  🏆 그누보드 5.0.41 패치 루루아빠 2015.07.20 3,436 0
HTML5  🏆 HTML5 Video 반응형으로 만들기 루루아빠 2015.07.19 2,999 0
HTML5  댓글+1🏆 HTML5 Video 볼륨 조정하기 루루아빠 2015.07.19 4,016 0
이윰  🏆 modal 오픈시 modal-dialog 아래 background body 스크롤 안되게 하기 루루아빠 2015.07.16 6,811 0