웹마스터 팁

히든 프레임으로 사랑비 BGM을 사용할 때 제로보드 레이아웃에서 사랑비 BGM 플레이어를 컨트롤 하는 '리모컨'입니다.
parent.frames['bgm'] 부분의 bgm을 사랑비 bgm 플레이어 프레임 이름으로 바꿔 주시면됩니다.
<frame name=bgm src=./bgm/sarangbi_bgm.php noresize> 이런식일때 사용하시면 됩니다.
예제 링크 : http://pwnet.kr  
추가적으로 생성한 오브젝트가 3개 있습니다.
1. mintime :: 현재 재생중인 시간을 표시하는 레이어. 기본상태 00:00
2. maxtime :: 현재 음악의 총 재생 시간을 표시하는 레이어. 기본상태 00:00
3. mu 폼의 mus 인풋박스 :: 사랑비 플레이어의 메시지를  표시하는 텍스트 박스

레이아웃 추가내용


   <!-- Sarangbi BGM Frame Controller -->
<div class="blogTitleBox">
<h2>PWnet BGM (<span id=mintime>00:00</span>/<span id=maxtime>00:00</span>)</h2>
</div>
<div class="widgetBox" align=center>
<!--<marquee scrollamount="5" behavior=alternate><span id=msglayer><h2 style="color:#00afcf;">Loading...</h2></span></marquee>-->
<form name=mu><input name=mus size=24 style="font-size:8pt;color:#00afcf;"></form>
<a onclick="parent.frames['bgm'].method_PreviousButtonPush();" onMouseOver="document.pre.src='http://pwnet.kr/bgm/skin/tomboy/button/back_over.gif';" onMouseOut="document.pre.src='http://pwnet.kr/bgm/skin/tomboy/button/back.gif';"><img name=pre src="http://pwnet.kr/bgm/skin/tomboy/button/back.gif" width="13" height="13" border="0" alt="이전"></a>
<a onclick="parent.frames['bgm'].method_PlayButtonPush();" onMouseOver="document.pla.src='http://pwnet.kr/bgm/skin/tomboy/button/play_over.gif';" onMouseOut="document.pla.src='+ '+ 'http://pwnet.kr/bgm/skin/tomboy/button/play.gif';"><img name=pla  src="http://pwnet.kr/bgm/skin/tomboy/button/play.gif" width="13 " height="13" border="0" alt="재생"></a>
<a onclick="parent.frames['bgm'].method_NextButtonPush();" onMouseOver="document.nex.src='http://pwnet.kr/bgm/skin/tomboy/button/forward_over.gif';" onMouseOut="document.nex.src='http://pwnet.kr/bgm/skin/tomboy/button/forward.gif';"><img name=nex src="http://pwnet.kr/bgm/skin/tomboy/button/forward.gif" width="13" height="13" border="0" alt="다음"></a>
<a onclick="parent.frames['bgm'].method_PauseButtonPush();" onMouseOver="document.pau.src='http://pwnet.kr/bgm/skin/tomboy/button/pause_over.gif';" onMouseOut="document.pau.src='http://pwnet.kr/bgm/skin/tomboy/button/pause.gif';"><img name=pau src="http://pwnet.kr/bgm/skin/tomboy/button/pause.gif" width="13 " height=" 13" border="0" alt="잠시멈춤"></a>
<a onclick="parent.frames['bgm'].method_StopButtonPush();" onMouseOver="document.sto.src='http://pwnet.kr/bgm/skin/tomboy/button/stop_over.gif';" onMouseOut="document.sto.src='+ 'http://pwnet.kr/bgm/skin/tomboy/button/stop.gif';"><img name=sto src="http://pwnet.kr/bgm/skin/tomboy/button/stop.gif" width="13" height="13" border="0" alt="정지"></a>
<a onclick="parent.frames['bgm'].method_VolumnUpButtonPush();" onMouseOver="document.volup.src='+ 'http://pwnet.kr/bgm/skin/tomboy/button/volume_up_over.gif';" onMouseOut="document.volup.src='http://pwnet.kr/bgm/skin/tomboy/button/volume_up.gif';"><img name=volup src="http://pwnet.kr/bgm/skin/tomboy/button/volume_up.gif" width="13" height="13" border="0" alt="소리 +"></a>
<a onclick="parent.frames['bgm'].method_VolumnDownButtonPush();" onMouseOver="document.voldn.src='http://pwnet.kr/bgm/skin/tomboy/button/volume_down_over.gif';" onMouseOut="document.voldn.src='http://pwnet.kr/bgm/skin/tomboy/button/volume_down.gif';"><img name=voldn src="http://pwnet.kr/bgm/skin/tomboy/button/volume_down.gif" width="13" height="13" border="0" alt="소리 -"></a>
<a onclick="parent.frames['bgm'].method_BGMListButtonPush();" onMouseOver="document.lis.src='http://pwnet.kr/bgm/skin/tomboy/button/list_over.gif';" onMouseOut="document.lis.src='http://pwnet.kr/bgm/skin/tomboy/button/list.gif';"><img name=lis src="http://pwnet.kr/bgm/skin/tomboy/button/list.gif" width="13" height="13" border="0" alt="플레이리스트"></a>
<!--@if($logged_info->is_admin == 'Y')-->
<a onclick="parent.frames['bgm'].method_SetupButtonPush();" onMouseOver="document.adm.src='http://pwnet.kr/bgm/skin/tomboy/button/admin_over.gif';" onMouseOut="document.adm.src='http://pwnet.kr/bgm/skin/tomboy/button/admin.gif';"><img name=adm src="http://pwnet.kr/bgm/skin/tomboy/button/admin.gif" width="13" height="13" border="0" alt="관리자페이지"></a> </div><!--@end-->

sarangbi_bgm.js 수정내용
// 웹브라우저 상태창에 출력
function private_Browser_Status( msg)
{
 if( invar_use_Browser_Status)
 {
  if( msg == '::SARANGBI BGM::')
   window.defaultStatus = msg;
  else
   window.defaultStatus = '[배경 음악] ' + msg;
try {
parent.frames['main'].mu.mus.value = msg;}
 catch(exception) {
}
}}


// 시간 표시 함수
function private_time()
{
 total_time=Math.floor( document.Sarangbi_Bgm.Duration);
 cur_time=Math.floor( document.Sarangbi_Bgm.currentPosition);

 if( invar_Error > 0){
  if( invar_Error <= 3){
   private_subject_show(11);
   invar_Error++;
  }else
   method_NextButtonPush();
 }else
  
 if( invar_Buffring == true)
  private_subject_show(6);
 else{
  invar_total_min=Math.floor( total_time/60);
  invar_total_sec=total_time - invar_total_min*60;

  invar_cur_min=Math.floor( cur_time/60);
  invar_cur_sec=cur_time - invar_cur_min*60;

  if( invar_total_min < 10) invar_total_min = "0" + invar_total_min;
  if( invar_total_sec < 10) invar_total_sec = "0" + invar_total_sec;
  if( invar_cur_min < 10) invar_cur_min = "0" + invar_cur_min;
  if( invar_cur_sec < 10) invar_cur_sec = "0" + invar_cur_sec;

  if( private_GetMediaState() == 2 && invar_use_Browser_Status) window.defaultStatus = '+ '[배경 음악] ' + invar_MusicTitle[invar_CurrentTrack] + " (" + invar_cur_min + ":" + invar_cur_sec + ")";
 
  if( invar_alltime_show) document.all.sarangbi_bgm_alltime.innerHTML = invar_total_min + ":" + invar_total_sec;
  if( invar_curtime_show) document.all.sarangbi_bgm_curtime.innerHTML = invar_cur_min + ":" + invar_cur_sec;
                private_Browser_Status(invar_MusicTitle[invar_CurrentTrack]);

try {
parent.frames['main'].mintime.innerHTML = invar_cur_min + ':' + invar_cur_sec;
parent.frames['main'].maxtime.innerHTML = invar_total_min + ':' + invar_total_min;
} catch(exception) {
}
}}


sarangbi_bgm.php 부분에
// 음악 리스트 출력 함수
function bgm_list()
{
 global $img_list, $img_list_over, $list_alt, $blend, $blend_time, $skin_dir, $list_width, $list_height, $list_one_music_height, $invar_use_frame, $invar_list_frame, $num_list;

 if( $img_list == '')
  missing_img('Music List 출력');
 else{
  echo "<script language=javascript>
  function method_BGMListButtonPush()
  {
   if( $invar_use_frame){
    $invar_list_frame.location.href='http://pwnet.kr/bgm/sarangbi_bgm_list.php';
   }else{
   var w = $list_width;
   var h = $list_height;
   var sw = window.screen.availWidth;
   var sh = window.screen.availHeight;

   if( invar_MusicCount > $num_list)
      h+=$list_one_music_height*$num_list;
   else
      h+=$list_one_music_height*invar_MusicCount;
 
   var sarangbi_bgm_list=window.open('http://pwnet.kr/bgm/sarangbi_bgm_list.php','Sarangbi_BGM_MusicList','scrollbars=yes,resizable=yes,width='+w+',height='+h);
 
   sarangbi_bgm_list.moveTo((sw - w) / 2, (sh - h) / 2);
   }
  }

  function bgmlist_over(){
   if( $blend)
    bt('sarangbi_bgm_list_image', '$skin_dir$img_list_over');
   else
    sarangbi_bgm_list_image.src="$skin_dir$img_list_over";
   private_btn_status('$list_alt');

  }

  function bgmlist_out(){
   if( $blend)
    bt('sarangbi_bgm_list_image', '$skin_dir$img_list');
   else
    sarangbi_bgm_list_image.src="$skin_dir$img_list";
  }

  document.write("<img id='sarangbi_bgm_list_image' src='$skin_dir$img_list' onmouseover='bgmlist_over();' onmouseout='bgmlist_out();' style='cursor:hand; filter:blendTrans(duration=$blend_time);' alt='$list_alt' onClick='method_BGMListButtonPush();'>");n</script>nn";
 }
}

// pause 버튼 출력 함수 (다음곡 play)
function bgm_admin()
{
 global $img_admin, $img_admin_over, $admin_alt, $skin_dir, $blend, $blend_time;

 if( $img_admin == '')
  missing_img('사랑비 BGM 관리 도구 출력');
 else{
  echo "<script language=javascript>
  function method_SetupButtonPush()
  {
   var w = 620;
   var h = 620;
   var sw = window.screen.availWidth;
   var sh = window.screen.availHeight;

   var sarangbi_setup=window.open('http://pwnet.kr/bgm/sarangbi_bgm_admin.php','Sarangbi_BGM_Setup','scrollbars=yes, resizable=yes,width='+w+',height='+h);

   sarangbi_setup.moveTo((sw - w) / 2, (sh - h) / 2);
  }

  function bgmadmin_over(){
   if( $blend)
    bt('sarangbi_bgm_admin_image', '$skin_dir$img_admin_over');
   else
    sarangbi_bgm_admin_image.src="$skin_dir$img_admin_over";
   private_btn_status('$admin_alt');

  }

  function bgmadmin_out(){
   if( $blend)
    bt('sarangbi_bgm_admin_image', '$skin_dir$img_admin');
   else
    sarangbi_bgm_admin_image.src="$skin_dir$img_admin";
  }

  document.write("<img id='sarangbi_bgm_admin_image' src='$skin_dir$img_admin' onmouseover='bgmadmin_over();' onmouseout='bgmadmin_out();' style='cursor:hand; filter:blendTrans(duration=$blend_time);' alt='$admin_alt' onClick='method_SetupButtonPush();'>");n</script>nn";
 }
}

제목 글쓴이 날짜
이전글, 다음글 코어 건드리지 않고 사용하기 (모듈X, 애드온X) (업데이트) [8] 시니시즘 2013.01.26
이미디오 (이미지->동영상) 기능을 적용해보자. [8] file asterisk 2013.02.12
팝업창 자동 사이즈 조절 js Alex 2013.02.17
출석부 소시랑 스킨 출석회원없을때 우측위젯이 아래로 떨어지는 현상 해결방법 [3] garnecia 2013.02.23
XE 루트로 옮기기 완벽 가이드 [/xe/ 로부터 벗어나자!] ver 1.1 [107] file LI-NA 2013.02.26
제로보드 4 -> xe 신버전으로 마이그레이션 경험담 [4] file 윤안젤로 2013.02.28
xe 속도 엄청 빨라집니다. [4] 투투투쓰리 2013.03.12
팝업 모듈에서, 사이트 전체에 팝업 띄우는 방법 모르시는 분들을 위해 ^^; [2] sejin7940 2013.03.13
1.7 버전의 새로워진 사이트맵(메뉴편집)에 적응해보자! [8] file EnuX 2013.03.15
요약 책갈피 경량판 sns 링크 버튼 디자인 보완 [1] file 웹플러스7 2013.03.21
팝업모듈에서 jQuery 충돌 해결 - 팝업창이 안뜰때. [5] file 똑디 2013.03.22
외부 이미지 저장 애드온 [7] file samsara 2013.03.26
admin_bar.html 오류 해결팁? [1] 윤성희R 2013.03.27
iframe 등의 태그 화이트리스트 도메인 확인/추가하기 [1] Gunmania 2013.03.27
Social XE 모듈의 클라이언트 토큰 발급 (난다날아님의 서버는 중지상태) [4] 팩트위키 2013.03.29
윈도우 서버 2012 에서 제로보드XE 설치부터 사용하기. [16] file 부롱이 2013.03.29
meta_add 애드온 수정.(1.7.3 버전에 맞게..) [4] file 투씨 2013.04.01
게시판 내용에서 하단에 빈 버튼 안보이게 하기 [2] file SEAN76 2013.04.04
xe1.7.3.1 으로의 업데이트시 팝업모듈 오류 수정내역 [1] 날마다좋은날 2013.04.12
아이콘샵(v0.4) 관리자페이지 디자인수정파일(1.7.x 용) file 카이네드 2013.04.13