업로드시 로딩중 메시지 보여주기 > 그누4 팁자료실

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.

업로드시 로딩중 메시지 보여주기 정보

업로드시 로딩중 메시지 보여주기

본문

알지보드에 공개되어있는 매드버드님의 로딩중 보여주기팁을 그누보드에 적용하는방법을 소개해드립니다.

먼저 팁을 공개하여주신 알지보드의 매드버드님께 감사드립니다...^^

팁은 여기
http://rgboard.com/rgboard/view.php?&ss[fc]=5&bbs_id=tip&page=&doc_num=211

파일은 여기
http://rgboard.com/rgboard/view.php?&ss[fc]=5&bbs_id=skin&page=&doc_num=284

에 있는 소스를 그누보드에 사용할수있도록 적용하는 방법입니다...

==================================================

우선 다운 받은 loding.swf 파일을 사용하시는 스킨의 img 폴더에 넣어주시고,

사용하시는 스킨의 write.skin.php 파일의

<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
?>

이부분 바로 아래에

<script>
function upload()
{
document.all.selection.style.visibility = "hidden";
document.all.upload.style.visibility = "visible";
}
</script>
<div id="upload" style="top:180;left:380; position:absolute; visibility:hidden;" align="center" valigh="middle">
 <table border="1" cellpadding="0" cellspacing="0" align="center" bordercolordark="white" bordercolorlight="black">
  <tr>
    <td width="200" height="60"><embed src="<?=$board_skin_path?>/img/loading.swf" width="200" height="60"></td>
  </tr>
 </table>
</div>

이렇게 넣어줍니다.

<form name="fwrite" method="post" action="javascript:fwrite_check(document.fwrite);" enctype="multipart/form-data" style="margin:0px;">

이부분을 찾아서

<form name="fwrite" method="post" action="javascript:fwrite_check(document.fwrite);" enctype="multipart/form-data" style="margin:0px;" onsubmit="return upload()">

이렇게 바꿔줍니다.

            objCell.innerHTML = "<input type='file' class=ed size=32 name='bf_file[]' title='파일 용량 <?=$upload_max_filesize?> 이하만 업로드 가능'>";

이 부분을 찾아서

            objCell.innerHTML = "<div id='selection' align='center' valigh='middle'><input type='file' class=ed size=32 name='bf_file[]' title='파일 용량 <?=$upload_max_filesize?> 이하만 업로드 가능'></div>";

이렇게 바꿔 줍니다...끝


이후 해당스킨을 사용하는 게시판에 파일을 업로드해보세요..

로딩중이라는 메시지가 보여질것입니다....^^
추천
3

댓글 19개

★★ 추가 팁입니다.


들여다 보니, 별거아닌데....스크립터를 제대로 다룰줄 몰라서 찾아내느라..마이~ 헤맸네요 ... -_- ;;

위 Photofly 님의 팁의 경우, 파일업로드시에 '로딩중~~'이란 화면을 띄워주는것이라면
제가 올리는 팁은 홈페이지 전반에 걸쳐서 화면이 바뀔때 '로딩중~'이라는 화면을 띄워주는것입니다.

위 팁과 함께 사용하시면 훨씬~~ 좋습니다. 파일업로드시는 위 팁을 그대로 적용한 상태에서
아래 팁을 함께 넣어주시면 됩니다.
파일로딩시는 위 팁이 적용되고 그다음 화면전환시 본 팁이 적용되므로 중복현상은 없습니다.


참고사이트 [http://www.habdongcar.co.kr]  -- 사이트에 테스트성 글이나 이미지 등록하지 마십시요.


[팁 적용하기]

1. 그누보드/head.sub.php 아래쪽에 있는 <body~~~~> 부분 바로 공백에 아래 코드를 넣으세요.
------------------------------------------------------------------------------------------------------------------------------------

<!-- 로딩중 화면표시 시작 -->
<table id="waiting" height="50" cellpadding=0 cellspacing=0 style="position:absolute; visibility:hidden;border:1px solid #666666;">
<tr><td align="center" width=400 style="font-size:9pt; background:#efefef;">
<b>데이터를 처리하는중입니다. 잠시만 기다려 주십시요...</b>
</td></tr></table>
<script language="Javascript">
wb = document.body.offsetHeight/2 - waiting.offsetHeight/2
wp = document.body.offsetWidth/2 -waiting.offsetWidth/2
waiting.style.top=wb
waiting.style.left=wp
waiting.style.visibility="visible"
</script>
<!-- 로딩중 화면표시 끝 -->




2. 그누보드/tail.sub.php 아래쪽에 있는
<script language="javascript" src="<?=$g4['path']?>/js/wrest.js"></script> 부분 아래에 코드를 넣으세요.
------------------------------------------------------------------------------------------------------------------------------------

<!-- 로딩중 화면표시 스크립터 -->
<script language="Javascript">
waiting.style.visibility="hidden"
</script>
<!-- 로딩중 화면표시 스크립터 끝 -->




만약 그룹으로 헤더를 만든경우라면, 원하는 그룹에만 적용시키고자 할때는
해당 그룹의 헤더와 풋터에 넣어주셔도 될껍니다.
테스트해보니..조금 다른게... 제가 올린 팁은 '파일업로드'시에 적용이 안되더군요.

적용이 안된다기 보다..
파일이 올라가는 도중에는 메세지를 띄우지 않고 화면이 바뀌는 순간에만 표시를 해주죠.
업로드 용량이 큰경우는 ..상태표시줄이 없는 경우, 님의 팁이 훨씬 효과적이죠.

따라서, Photofly 님꺼랑 같이 쓰면 Photofly 님의 로딩메세지후,
화면전환시 제 팁이 '로딩메세지'를 표시해주니 좀더 자연스럽더군요... ^^;;
그 소스도 write.skin.php 파일에 적용하면 업로드 메시지보여주기로 됩니다....^^
본문에 있는 팁도 head.sub.php 파일에 적용하면 forever 님의 팁과 같은 효과가 나오구요...^^
저는 안되길래 조금 고쳐 봤더니 되네요

{
document.all.selection.style.visibility = "hidden";
document.all.upload.style.visibility = "visible";
}
</script>
<div id="upload" style="top:180;left:380; position:absolute; display:hidden;" align="center" valigh="middle">
여기서 visibility가 브라우저에서 지원을 못하는거 같아서
{
document.all.selection.style.display = "none";
document.all.upload.style.display = "inline";
}
</script>
<div id="upload" style="top:180;left:380; position:absolute; display:none;" align="center" valigh="middle">
display에 해당하는 부분만 none, inline으로 바꿨습니다
그러니 잘 되네요 잘 쓰겠습니다
저는 잘되는데요~!
아 수정 저도 에러 납니다~!파폭에서는 없었는데 IE에서는 보이는군요~~스크립트 문제입니다.
이렇게도 사용해 보세요.....^^


loading.swf 파일은 img 폴더에 넣으시고,

head.sub.php 파일의 최하단에

<!-- 로딩중 화면표시 시작 -->
<div id="waiting" style="clear:both; padding-top:0px; position:absolute; visibility:hidden;" align="center" valigh="middle">
<embed src="<?=$g4['path']?>/img/loading.swf" width="200" height="60">
</div>
<script language="Javascript">
wb = document.body.offsetHeight/2 - waiting.offsetHeight/2
wp = document.body.offsetWidth/2 -waiting.offsetWidth/2
waiting.style.top=wb
waiting.style.left=wp
waiting.style.visibility="visible"
</script>
<!-- 로딩중 화면표시 끝 -->

이렇게 넣어주시고,

tail.sub.php 파일의 상단

<script language="javascript" src="<?=$g4['path']?>/js/wrest.js"></script>

바로 아래에

<!-- 로딩중 화면표시 스크립터 -->
<script language="Javascript">
waiting.style.visibility="hidden"
</script>
<!-- 로딩중 화면표시 스크립터 끝 -->


이렇게 넣어 보세요....^^

전체 페이지에서 로딩이 느릴경우에만 로딩중 메세지가  보여질겁니다....^^
전체 3,313 |RSS
그누4 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT