SketchBook5 스킨의 jPlayer 스킨 만드는 방법

music.css

skin/board/sketchbook5/images/bg_shelf.jpg

145 × 505px

jPlayer 스킨 이미지입니다.

 

좀 쉽게 만들기 위해 소스를 약간 수정합니다.

 

skin/board/sketchbook5/css/music.css

 

.frameset2{background:url(../images/bg_shelf.jpg) 0px -80px;

를

.frameset2{background:url(../images/bg_shelf.jpg) 0px;

로...

 

상 : 145 × 25px

중 : 145 × 230px

하 : 145 × 23px

 

가로폭은 마음대로 해도 될겁니다.

3개의 이미지를 만들어 색을 넣은 후

사이에 1px의 여백을 넣어 이어붙힙니다. (145 × 280px)

 

선반 형식으로 하지않고 그냥 이렇게 통짜 그림으로 까셔도 됩니다.

게시판 폭 × 280px

비율이 달라지면... CD 모양은 왼쪽으로, 나머지 내용은 오른쪽으로 가게 됩니다.

 

모바일에서도 스케치북 스킨을 사용하려면 'mobile/skin/board'에 동일하게 넣어주고 게시판 스킨 설정을 해주면 됩니다.

하지만 모바일에서 수정해야 할 것들이 여러군데 보입니다.
jPlayer는 아래와 같이 간단한 수정만 해보았습니다.

보여줄 화면이 작기 때문에 두번째 업로드 이미지는 출력되지않게 합니다.

mobile/skin/board/sketchbook5/view.skin.php


mobile/skin/board/sketchbook5/css/music.css
도 소소하게 수정해줍니다.

첨부한 music.css 파일은 모바일용입니다.

몇군데 조금 수정한 정도이니

참고만 하십시오.

 

 

예 : http://internationale.kr/bbs/board.php?bo_table=info_sketchbook&wr_id=1&me_code=4090