알릭님 글을 읽다가 떠오르는게 있어서 ^^;
몇년(?)전 공개 했던 메시지 도착하면 메시지창 자동으로 띄우는 방식을 이용한 방법 입니다.
이방법은 제로보드에서 사용중이신 아웃로그인을 이용하는 방법입니다.
역시 아웃로그인이 포함되어 있는 페이지에서만 유효한 방법 입니다.
(편법으로는 화면에 아무런 출력도 하지 않는 아웃로그인페이지를 만들어서
아웃로그인이 포함되어 있지 않은 페이지에 추가하시는 방법등을 이용해 사용하실수도 있습니다.)
아웃로그인을 사용하는 방법등은 생략합니다.
동작샘플은... https://iq140.qlove.co.kr/test/msn_a_test.php
예 아니오 버튼은 동작하지 않습니다. ^^; 그냥 어떤식으로 나오는지만 보세요 ^^;
그럼 설명 들어 갑니다. ^^;
아웃로그인이 설치되어 있는 디렉토리를 조금 살펴보면,
outlogin_skin/default 이런식으로 되어 있을것입니다.
사용중인 아웃로그인의 해당 디렉토리를 찾으셔야 합니다. ^^; 설명을 위해 default 스킨을 예를들어 설명합니다.
별건 없습니다. logged.html 파일 맨 밑에줄에 아래 소스를 추가하시는것만으로 끝입니다. ^^;
배경파일은 해당아웃로그인 스킨 디렉토리 밑에 images 디렉토리에 올려주시면 됩니다.
파일명이 다를경우 ^^; 아래 [dir]msg_back.png부분을 수정해주시면 되겠습니다.
배경파일은 아래 알릭님이 올려주신 msn형태를 사용하였습니다. ^^; (알릭님이 보시면 양해해주시길 기대합니다.)
다운로드 역시 알릭님 게시물을 참고 하시기 바랍니다. https://www.nzeo.com/bbs/zboard.php?id=cgi_tip&no=7101
-------------------------------------------------------------------------------------------------------
<style type="text/css">
#dropinboxv2cover { width: 220px; height: 180px; position:absolute; z-index: 100; overflow:hidden; visibility: hidden; }
#dropinboxv2{ background-color: lightyellow; width: 202px; height: 160px; border: 0px solid black; padding: 0px; position:absolute; left: 0; top: 0; }
</style>
<script type="text/javascript">
if (window.innerWidth) { var dropboxleft = window.innerWidth; } else { var dropboxleft = window.document.body.offsetWidth; }
if (window.innerHeight) { var dropboxtop = window.innerHeight; } else { var dropboxtop = window.document.body.offsetHeight; }
var dropboxleft = dropboxleft - 240;
var dropboxtop = dropboxtop - 200;
var close_delay = 4000;
var dropspeed=15;
// always - 계속 알림창이 뜹니다. today - 취소 할경우 오늘하루만 알림창이 뜨지 않습니다.
var displaymode="always";
if (parseInt(displaymode)!=NaN)
var random_num=Math.floor(Math.random()*displaymode)
var ie=document.all
var dom=document.getElementById
function initboxv1(){
if (!dom&&!ie) { return }
crossboxcover=(dom)?document.getElementById("dropinboxv2cover") : document.all.dropinboxv2cover
crossbox=(dom)?document.getElementById("dropinboxv2"): document.all.dropinboxv2
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
crossbox.height=crossbox.offsetHeight
crossboxcover.style.height=parseInt(crossbox.height)+"px"
crossbox.style.top=scroll_top+crossbox.height*(-1)+"px"
crossboxcover.style.left=dropboxleft+"px"
crossboxcover.style.top=scroll_top+dropboxtop+"px"
// clearInterval(dropstart);
crossbox.style.top=0 ;
}
function initboxv2(){
if (!dom&&!ie) { return }
crossboxcover=(dom)?document.getElementById("dropinboxv2cover") : document.all.dropinboxv2cover
crossbox=(dom)?document.getElementById("dropinboxv2"): document.all.dropinboxv2
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
crossbox.height=crossbox.offsetHeight
crossboxcover.style.height=parseInt(crossbox.height)+"px"
crossbox.style.top=crossbox.height*(-1)+"px"
crossboxcover.style.left=dropboxleft+"px"
crossboxcover.style.top=dropboxtop+"px"
crossboxcover.style.visibility=(dom||ie)? "visible" : "show"
dropstart=setInterval("dropinv2()",50)
}
function dropinv2() {
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
if (parseInt(crossbox.style.top)<0) {
crossboxcover.style.top=scroll_top+dropboxtop+"px"
crossbox.style.top=parseInt(crossbox.style.top)+dropspeed+"px"
} else {
clearInterval(dropstart)
crossbox.style.top=0 ;
}
}
function dismissboxv1(){
if (window.dropstart) clearInterval(dropstart);
crossboxcover=(dom)?document.getElementById("dropinboxv2cover") : document.all.dropinboxv2cover
crossboxcover.style.filter='blendTrans(duration=1)';
crossboxcover.filters.blendTrans.apply();
crossboxcover.style.visibility="hidden";
crossboxcover.filters.blendTrans.play();
}
function dismissboxv2() {
var today = new Date();
document.cookie="droppedinv2="+today.getDate();
if (window.dropstart) { clearInterval(dropstart); crossboxcover.style.visibility="hidden"; }
}
function truebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = ""
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset)
if (end == -1) {
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
}
return returnvalue;
}
</script>
<script type="text/javascript">
var memo = '[memo]';
memolength=memo.length-33;
if (memo.substring(memolength,memolength+2)=='on' ) {
var date = new Date();
if (displaymode=="oncepersession" && get_cookie("droppedinv2")=="" || displaymode=="always" || parseInt(displaymode)!=NaN && random_num==0 || displaymode=="today" && get_cookie("droppedinv2")!=date.getDate() ) {
if (window.addEventListener) { window.addEventListener("load", initboxv2, false) }
else if (window.attachEvent) { window.attachEvent("onload", initboxv2) }
else if (document.getElementById || document.all) { window.onload=initboxv2 }
if (displaymode=="oncepersession") { document.cookie="droppedinv2=yes"; }
}
}
temp=setTimeout('dismissboxv1()',close_delay);
var old_ResizeHandler = window.onresize;
window.onresize = new Function("{if (old_ResizeHandler != null) old_ResizeHandler(); initboxv1();}");
var old_ScrollHandler = window.onscroll;
window.onscroll = new Function("{if (old_ScrollHandler != null) old_ScrollHandler(); initboxv1();}");
</script>
<div id="dropinboxv2cover">
<div id="dropinboxv2">
<table width="202" height="160" border="0" cellspacing="0" cellpadding="0" background="[dir]msg_back.png">
<tr>
<td align=left height=20><font color="black"> ::: 쪽지알림 :::</font></td>
<td align=center onclick="clearInterval(dropstart);crossboxcover.style.visibility='hidden';"> & nbsp; & nbsp; </td>
</tr>
<tr>
<td colspan=2 align=left>
메시지가 도착하였습니다.<br>
확인 하시겠습니까?<br><br>
<br>
<p align="right">
<button style="border: 1px solid #93ACCF" onclick="window.open('[dir]../../../member_memo.php','member_memo','width=450,height=500,status=no,toolbar=no,resizable=yes,scrollbars=yes');dismissboxv1();"> 예 </button> & nbsp; & nbsp;
<button style="border: 1px solid #93ACCF" onclick="dismissboxv2();return false"> 아니오 </button> & nbsp;
</p>
</td>
</tr>
</table>
</div>
</div>
-------------------------------------------------------------------------------------------------------
소스가 조금 길긴 하네요 ^^;
그래도 소스자체에 어려운점은 없으므로 여러가지 원하시는 형태로 수정하시는데 용이할것으로 예상합니다.
var displaymode="always" 이부분의 설명이 조금 필요한데요 ^^;
today는 아니오를 선택했을경우 오늘 하루동안은 알림창을 띄우지 않습니다.
(이때는 새로운 메시지가 도착하더라도 알림창은 뜨지 않습니다. )
always 를 입력하면 확인하실때까지 계속 뜹니다. ^^; (메시지창을 열게되면 알림창이 뜨지 않습니다.)
oncepersession 도 있는데 ^^; 요건 적용할려다가 반쪽이네요.. 알림창 뜨는걸 싫어하시는분들이 계실꺼 같아서
수정해보려다 방법이 생각이 안나서 ^^; 이모드를 입력하시면 알림창이 계속 뜨지 않습니다. ^^;
[이 설정은 쿠키를 이용하므로 쿠키의 문제점(별로 큰 문제가 되지는 않지만..)이 드러나게 됩니다.]
나그네인생님이 건의해주신부분도 포함시켰습니다. (스크롤될경우 따라다니도록 수정...)
헐랭이님이 건의해주신부분도 포함시켰습니다. (시간경과시 자동으로 닫히도록 수정...)
var close_delay = 4000; 숫자를 원하는만큼 수정하시면 됩니다. 지금은 약4초정도(?)
이방법은 단일프레임을 기준으로 제작되었기 때문에..
다중프레임을 이용하시는분들께서는 적용하실때 주의하시거나, 다른방법을 이용하셔야 할듯 합니다.
FireFox 1.1.0 , Netscape 8.0.1 , IE 6.0의 브라우져에서 동작상태를 확인 하였습니다. ^^;
몇년(?)전 공개 했던 메시지 도착하면 메시지창 자동으로 띄우는 방식을 이용한 방법 입니다.
이방법은 제로보드에서 사용중이신 아웃로그인을 이용하는 방법입니다.
역시 아웃로그인이 포함되어 있는 페이지에서만 유효한 방법 입니다.
(편법으로는 화면에 아무런 출력도 하지 않는 아웃로그인페이지를 만들어서
아웃로그인이 포함되어 있지 않은 페이지에 추가하시는 방법등을 이용해 사용하실수도 있습니다.)
아웃로그인을 사용하는 방법등은 생략합니다.
동작샘플은... https://iq140.qlove.co.kr/test/msn_a_test.php
예 아니오 버튼은 동작하지 않습니다. ^^; 그냥 어떤식으로 나오는지만 보세요 ^^;
그럼 설명 들어 갑니다. ^^;
아웃로그인이 설치되어 있는 디렉토리를 조금 살펴보면,
outlogin_skin/default 이런식으로 되어 있을것입니다.
사용중인 아웃로그인의 해당 디렉토리를 찾으셔야 합니다. ^^; 설명을 위해 default 스킨을 예를들어 설명합니다.
별건 없습니다. logged.html 파일 맨 밑에줄에 아래 소스를 추가하시는것만으로 끝입니다. ^^;
배경파일은 해당아웃로그인 스킨 디렉토리 밑에 images 디렉토리에 올려주시면 됩니다.
파일명이 다를경우 ^^; 아래 [dir]msg_back.png부분을 수정해주시면 되겠습니다.
배경파일은 아래 알릭님이 올려주신 msn형태를 사용하였습니다. ^^; (알릭님이 보시면 양해해주시길 기대합니다.)
다운로드 역시 알릭님 게시물을 참고 하시기 바랍니다. https://www.nzeo.com/bbs/zboard.php?id=cgi_tip&no=7101
-------------------------------------------------------------------------------------------------------
<style type="text/css">
#dropinboxv2cover { width: 220px; height: 180px; position:absolute; z-index: 100; overflow:hidden; visibility: hidden; }
#dropinboxv2{ background-color: lightyellow; width: 202px; height: 160px; border: 0px solid black; padding: 0px; position:absolute; left: 0; top: 0; }
</style>
<script type="text/javascript">
if (window.innerWidth) { var dropboxleft = window.innerWidth; } else { var dropboxleft = window.document.body.offsetWidth; }
if (window.innerHeight) { var dropboxtop = window.innerHeight; } else { var dropboxtop = window.document.body.offsetHeight; }
var dropboxleft = dropboxleft - 240;
var dropboxtop = dropboxtop - 200;
var close_delay = 4000;
var dropspeed=15;
// always - 계속 알림창이 뜹니다. today - 취소 할경우 오늘하루만 알림창이 뜨지 않습니다.
var displaymode="always";
if (parseInt(displaymode)!=NaN)
var random_num=Math.floor(Math.random()*displaymode)
var ie=document.all
var dom=document.getElementById
function initboxv1(){
if (!dom&&!ie) { return }
crossboxcover=(dom)?document.getElementById("dropinboxv2cover") : document.all.dropinboxv2cover
crossbox=(dom)?document.getElementById("dropinboxv2"): document.all.dropinboxv2
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
crossbox.height=crossbox.offsetHeight
crossboxcover.style.height=parseInt(crossbox.height)+"px"
crossbox.style.top=scroll_top+crossbox.height*(-1)+"px"
crossboxcover.style.left=dropboxleft+"px"
crossboxcover.style.top=scroll_top+dropboxtop+"px"
// clearInterval(dropstart);
crossbox.style.top=0 ;
}
function initboxv2(){
if (!dom&&!ie) { return }
crossboxcover=(dom)?document.getElementById("dropinboxv2cover") : document.all.dropinboxv2cover
crossbox=(dom)?document.getElementById("dropinboxv2"): document.all.dropinboxv2
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
crossbox.height=crossbox.offsetHeight
crossboxcover.style.height=parseInt(crossbox.height)+"px"
crossbox.style.top=crossbox.height*(-1)+"px"
crossboxcover.style.left=dropboxleft+"px"
crossboxcover.style.top=dropboxtop+"px"
crossboxcover.style.visibility=(dom||ie)? "visible" : "show"
dropstart=setInterval("dropinv2()",50)
}
function dropinv2() {
scroll_top=(ie)? truebody().scrollTop : window.pageYOffset
if (parseInt(crossbox.style.top)<0) {
crossboxcover.style.top=scroll_top+dropboxtop+"px"
crossbox.style.top=parseInt(crossbox.style.top)+dropspeed+"px"
} else {
clearInterval(dropstart)
crossbox.style.top=0 ;
}
}
function dismissboxv1(){
if (window.dropstart) clearInterval(dropstart);
crossboxcover=(dom)?document.getElementById("dropinboxv2cover") : document.all.dropinboxv2cover
crossboxcover.style.filter='blendTrans(duration=1)';
crossboxcover.filters.blendTrans.apply();
crossboxcover.style.visibility="hidden";
crossboxcover.filters.blendTrans.play();
}
function dismissboxv2() {
var today = new Date();
document.cookie="droppedinv2="+today.getDate();
if (window.dropstart) { clearInterval(dropstart); crossboxcover.style.visibility="hidden"; }
}
function truebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = ""
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset)
if (end == -1) {
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
}
return returnvalue;
}
</script>
<script type="text/javascript">
var memo = '[memo]';
memolength=memo.length-33;
if (memo.substring(memolength,memolength+2)=='on' ) {
var date = new Date();
if (displaymode=="oncepersession" && get_cookie("droppedinv2")=="" || displaymode=="always" || parseInt(displaymode)!=NaN && random_num==0 || displaymode=="today" && get_cookie("droppedinv2")!=date.getDate() ) {
if (window.addEventListener) { window.addEventListener("load", initboxv2, false) }
else if (window.attachEvent) { window.attachEvent("onload", initboxv2) }
else if (document.getElementById || document.all) { window.onload=initboxv2 }
if (displaymode=="oncepersession") { document.cookie="droppedinv2=yes"; }
}
}
temp=setTimeout('dismissboxv1()',close_delay);
var old_ResizeHandler = window.onresize;
window.onresize = new Function("{if (old_ResizeHandler != null) old_ResizeHandler(); initboxv1();}");
var old_ScrollHandler = window.onscroll;
window.onscroll = new Function("{if (old_ScrollHandler != null) old_ScrollHandler(); initboxv1();}");
</script>
<div id="dropinboxv2cover">
<div id="dropinboxv2">
<table width="202" height="160" border="0" cellspacing="0" cellpadding="0" background="[dir]msg_back.png">
<tr>
<td align=left height=20><font color="black"> ::: 쪽지알림 :::</font></td>
<td align=center onclick="clearInterval(dropstart);crossboxcover.style.visibility='hidden';"> & nbsp; & nbsp; </td>
</tr>
<tr>
<td colspan=2 align=left>
메시지가 도착하였습니다.<br>
확인 하시겠습니까?<br><br>
<br>
<p align="right">
<button style="border: 1px solid #93ACCF" onclick="window.open('[dir]../../../member_memo.php','member_memo','width=450,height=500,status=no,toolbar=no,resizable=yes,scrollbars=yes');dismissboxv1();"> 예 </button> & nbsp; & nbsp;
<button style="border: 1px solid #93ACCF" onclick="dismissboxv2();return false"> 아니오 </button> & nbsp;
</p>
</td>
</tr>
</table>
</div>
</div>
-------------------------------------------------------------------------------------------------------
소스가 조금 길긴 하네요 ^^;
그래도 소스자체에 어려운점은 없으므로 여러가지 원하시는 형태로 수정하시는데 용이할것으로 예상합니다.
var displaymode="always" 이부분의 설명이 조금 필요한데요 ^^;
today는 아니오를 선택했을경우 오늘 하루동안은 알림창을 띄우지 않습니다.
(이때는 새로운 메시지가 도착하더라도 알림창은 뜨지 않습니다. )
always 를 입력하면 확인하실때까지 계속 뜹니다. ^^; (메시지창을 열게되면 알림창이 뜨지 않습니다.)
oncepersession 도 있는데 ^^; 요건 적용할려다가 반쪽이네요.. 알림창 뜨는걸 싫어하시는분들이 계실꺼 같아서
수정해보려다 방법이 생각이 안나서 ^^; 이모드를 입력하시면 알림창이 계속 뜨지 않습니다. ^^;
[이 설정은 쿠키를 이용하므로 쿠키의 문제점(별로 큰 문제가 되지는 않지만..)이 드러나게 됩니다.]
나그네인생님이 건의해주신부분도 포함시켰습니다. (스크롤될경우 따라다니도록 수정...)
헐랭이님이 건의해주신부분도 포함시켰습니다. (시간경과시 자동으로 닫히도록 수정...)
var close_delay = 4000; 숫자를 원하는만큼 수정하시면 됩니다. 지금은 약4초정도(?)
이방법은 단일프레임을 기준으로 제작되었기 때문에..
다중프레임을 이용하시는분들께서는 적용하실때 주의하시거나, 다른방법을 이용하셔야 할듯 합니다.
FireFox 1.1.0 , Netscape 8.0.1 , IE 6.0의 브라우져에서 동작상태를 확인 하였습니다. ^^;