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

페이지 정보

루루아빠 3,342 2015.07.30 17:45

평점

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

본문

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

/* modal창 크기 변경하기 */
.modal {
    position: fixed;
    top: 2%;
    right: 2%;
    left: 2%;
    bottom: 2%;
    width: auto;
    height: auto;
    margin: 0;
}
/* Large desktops and laptops */
@media (min-width: 1200px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 400px;
        height: 230px;
    }
}
/* Landscape tablets and medium desktops */
@media (min-width: 1002px) and (max-width: 1199px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 400px;
        height: 230px;
    }
}
/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 1001px) {
    .modal-dialog {
      width: 100%;
      height: 100%;
      margin: 0px auto;
    }
    .modal-sm {
        width: 400px;
        height: 230px;
    }
}
/* Landscape phones and portrait tablets */
@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;
/*     padding: 5px 15px 5px 15px; */
}
.modal-title {
    margin-top: 0px
}
.modal-header .close {
  margin-top: 3px;
}
.modal-footer {
    text-align: left;
    padding: 11px;
}

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


 
추천인
  • 추천해 주세요
6
루루아빠 - 회원등급 : 최고관리자 - 포인트 : 1,293,063
레벨 96
경험치 1,394,542

Progress Bar 93%

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

댓글

첫 번째 댓글을 남겨 주세요

Total 242913 페이지
제목 글쓴이 날짜 조회 추천
이윰  🏆 본문 내용 추출시 특정 태그 제거하기 루루아빠 2016.05.09 2,517 0
이윰  🏆 태그 클릭시 관련된 게시글 페이지당 노출 갯수 정하기 루루아빠 2016.10.09 2,495 0
이윰  🏆 반응형 테마 PC에서 메인과 사이드 레이아웃 위치 변경하기 루루아빠 2016.11.22 2,494 0
이윰  🏆 이윰빌더 외부이미지 로컬 저장 https 보안서버도 적용하기 루루아빠 2017.11.22 2,490 0
이윰  🏆 최신글 카테고리 추출 옵션 루루아빠 2016.02.25 2,488 0
이윰  댓글+3🏆 출석체크 점수 경험치로 부여하기 루루아빠 2019.08.11 2,488 2
이윰  🏆 Eyoom Builder 1.2.4 패치 루루아빠 2016.04.23 2,483 0
이윰  🏆 게시글 작성시 전화번호 입력하고 구독자가 전화걸 수 있게 하기 루루아빠 2015.09.17 2,482 0
이윰  🏆 최신글에서 글 작성 시간을 나타내지 않기 루루아빠 2017.02.16 2,466 0
이윰  댓글+2🏆 회원 프로필 사진 변경시 바로 갱신하여 보여 주기 shadow2fox 2018.12.04 2,448 0
이윰  🏆 🎞️ 게시글 본문에 동영상(HTML5)이 있을 시 아이콘 보여주기 루루아빠 2018.01.29 2,437 0
이윰  🏆 특정 게시판에 다른 헤더 파일 불러오기 루루아빠 2016.10.01 2,433 0
이윰  🏆 Eyoom Builder 3.0.9 패치 shadow2fox 2019.03.25 2,432 0
이윰  🏆 🎞️ Input 관련 버튼과 이윰 버튼 정렬 맞추기 루루아빠 2015.11.17 2,432 0
이윰  🏆 이윰빌더 외부이미지 로컬 저장시 용량 줄이기 루루아빠 2017.11.23 2,431 0
이윰  🏆 이윰빌더 조건문 변수 루루아빠 2016.12.13 2,429 0
이윰  🏆 Eyoom Builder 1.3.2 패치 루루아빠 2017.11.21 2,425 0
이윰  🏆 Eyoom Builder 1.3.15 패치 루루아빠 2018.01.05 2,423 0
이윰  🏆 Eyoom Builder 1.3.4 패치 루루아빠 2017.11.21 2,415 0
이윰  🏆 게시판 관리자의 레벨이 글쓰기 권한보다 낮더라도 태그 작성하기 루루아빠 2017.05.03 2,389 0