[G5] 이미지나 동영상을 모바일에서 창 크기에 맞춰 출력하기 > 온라인강의

본문 바로가기
 
 
 
비즈니스의 시작 비즈명함 ~ 가격, 품질, 배송 3가지 만족을 드리는 비즈명함 / 즉석명함 / 급행서비스 / 서울 전지역 수도권일부 3시간배송

오늘 11
어제 1,401
최대 2,526
전체 3,673,214

최근 방문자

2264
2251
2158
2052
1401
11
12 13 14 15 16 17
select * from g5_menu where me_use = '1' and me_link like '%lecture%'
온라인강좌 홈 > 온라인강좌 > 온라인강좌

그누보드 | [G5] 이미지나 동영상을 모바일에서 창 크기에 맞춰 출력하기

페이지 정보

작성일2017-09-18 14:03 조회529회 댓글0건

본문

이미지나 동영상을 모바일에서 창 크기에 맞춰 출력하는 방법입니다.


1. jquery.mobile.resize.js 다운로드
다운받은 파일을  그누보드 / js / 에 업로드 합니다.
js 파일은 https://sir.kr/g5_tip/2024 에서 다운로드 받으세요



2. 그누보드5 / theme / basic / css / mobile.css 에 내용 추가

img,
video {
    display: inline-block;
    width: auto\9 !important; /* ie8 */
    width: auto !important;
    max-width: 100%;
    height: auto !important;
}
.video-container {
    position: relative;
    height: 0;
    padding-top: 30px;
    padding-bottom: 56.25%;
    overflow: hidden;
}
.video-container iframe,.video-container object,.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#ctt_con img,
video {
    display: inline-block;
    width: auto\9 !important; /* ie8 */
    width: auto !important;
    max-width: 100%;
    height: auto !important;
}
.video-container {
    position: relative;
    height: 0;
    padding-top: 30px;
    padding-bottom: 56.25%;
    overflow: hidden;
}
.video-container iframe,.video-container object,.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



3. 그누보드5 / skin / board / basic / view.skin.php 에 내용 추가

<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>

을 아래와 같이 내용 변경

<script src="<?php echo G5_JS_URL; ?>/viewimageresize.js"></script>
<script src="<?php echo G5_JS_URL; ?>/jquery.mobile.resize.js"></script>

<?php if ($board['bo_download_point'] < 0) { ?>



자료출처
https://sir.kr/g5_tip/2024
https://sir.kr/g5_tip/4890
  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기

댓글목록

등록된 댓글이 없습니다.


목록

Total 2,151건 1 페이지
온라인강의 목록
번호 제목
공지
일반 온라인 강좌를 소개합니다. (up.2017-12-05 16:33) 인기글 Hit.14390
2150
일반 파일명에 허용/금지 글자 (up.2017-12-15 06:00) Hit.23
2149
2148
2147
2146
2145
그누보드 [G5] 모바일 메뉴 (up.2017-12-11 11:17) 첨부파일 Hit.48
2144
2143
2142
2141
MSSQL CentOS7 + PHP7 + SQL Server 연결 (up.2017-12-07 16:22) Hit.140
2140
2139
Linux [FreeTDS] TDS(Tabular Data Stream) (up.2017-12-07 07:03) Hit.141
2138
Linux SED 명령어 사용법 (wr.2017-12-03) Hit.137
2137
2136
일반 IP로 국가 판별하기 (wr.2017-12-01) Hit.177
2135
그누보드 [G5] 댓글(코멘트) 페이징 (up.2017-12-01 06:32) Hit.188
2134
2133
2132
2131
2130
2129
2128
2127
MySQL sql_mode (up.2017-11-26 04:25) Hit.231
게시물 검색
 
 
상호: 해피정닷컴 대표:정창용 사업자등록번호:119-05-36414 (08394) 서울시 구로구 디지털로 242 한화비즈메트로1차 1502호
전화: 070-7600-3500 팩스:02-865-3528 개인정보관리:정창용 mail@happyjung.com 에스크로확인
개인정보취급방침
COPYRIGHT 2001~2017 해피정닷컴. All rights reserved. 통신판매신고:2014-서울구로-0074
 
모바일 버전으로 보기