공지사항용 - 레이어 팝업 정보
최신글 공지사항용 - 레이어 팝업첨부파일
본문
공지사항용 레이어 팝업입니다.
제가 이래저래 수정하다가 성공해서 올려봅니다.
모르는게 많다보니 여기저기서 소스 가져다 짜집기 했습니다.
일반적인 최신글 스킨처럼 사용하시면 되구요.
div로 팝업창을 만들어 iframe으로 내용을 불러들이는 방식입니다.
팝업창은 드레그 가능합니다.
제가 이래저래 수정하다가 성공해서 올려봅니다.
모르는게 많다보니 여기저기서 소스 가져다 짜집기 했습니다.
일반적인 최신글 스킨처럼 사용하시면 되구요.
div로 팝업창을 만들어 iframe으로 내용을 불러들이는 방식입니다.
팝업창은 드레그 가능합니다.
추천
2
2
댓글 전체
좋은 자료 감사합니다.
그런데 탭방식으로 표현을 할려면 어떻게 해야 하는지요..
탭형식으로좀 알려주시면 안될까요?
그런데 탭방식으로 표현을 할려면 어떻게 해야 하는지요..
탭형식으로좀 알려주시면 안될까요?
more눌러면 에러나네요...
아.. 골든님 죄송합니다. 제게 맞게 하다보니...^^;;
저는 게시판 자체를 레이어 팝업으로 불러오다보니 이런일이 생겼네요.
latest.skin.php 16번 줄에 <a href='../comm.php'>부분을 <a href='<?=$g4[bbs_path]?>/board.php?bo_table=<?=$board[bo_table]?>'>이렇게 수정하시면 됩니다.
제경우에 페이지 자체가 크기 고정이 있어서 직접 화면에 불러올 수 없습니다.
화면 전체가 레이어라서요. 그래서 레이어팝업을 생각하게 되었구요.
게시판들을 모아서 외부페이지에서 게시판명에 링크를 거는 방식으로 레이어팝업을 띄워 사용하고 있습니다.
그러다보니 문제가 게시판 자체에 head/tail이 적용되면 레이어팝업에서도 적용이 되는군요.
하나 해결했다고 급하게 올리다보니 이런 문제가 있었네요. 죄송합니다.
그리고 탭방식은 어떤걸 말씀하시는지....
사용하고 계시는 내용을 알려주시면 확인해 보겠습니다.
저는 게시판 자체를 레이어 팝업으로 불러오다보니 이런일이 생겼네요.
latest.skin.php 16번 줄에 <a href='../comm.php'>부분을 <a href='<?=$g4[bbs_path]?>/board.php?bo_table=<?=$board[bo_table]?>'>이렇게 수정하시면 됩니다.
제경우에 페이지 자체가 크기 고정이 있어서 직접 화면에 불러올 수 없습니다.
화면 전체가 레이어라서요. 그래서 레이어팝업을 생각하게 되었구요.
게시판들을 모아서 외부페이지에서 게시판명에 링크를 거는 방식으로 레이어팝업을 띄워 사용하고 있습니다.
그러다보니 문제가 게시판 자체에 head/tail이 적용되면 레이어팝업에서도 적용이 되는군요.
하나 해결했다고 급하게 올리다보니 이런 문제가 있었네요. 죄송합니다.
그리고 탭방식은 어떤걸 말씀하시는지....
사용하고 계시는 내용을 알려주시면 확인해 보겠습니다.
레이어팝업 띄우는 방법은
<a href='javascript:void(0);' onclick=\"document.getElementById('popup').style.display = 'block'; divif.location.href='url'>
onclick에서 타겟을 divif(iframe name입니다.)지정하는 방식으로 사용했습니다.
적절히 사용하시면 텝에서도 가능할거 같은데요.
<!--// div 팝업 //-->
<style>
#popup {
position: absolute;
width: 100%;
height: 100%;
display: none;
border: 1px solid gray;
background-color: #FFFFFF;
font: 12px verdana;
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color=#999999, Positive=true);
}
.toolbar {
font: 12px verdana;
border-bottom: 1px solid black;
background-color: #bbbbbb;
padding: 1px;
}
</style>
<script>
clicked = false;
function startDrag(cx,cy) {
clicked = true;
pleft=parseInt(document.getElementById("popup").style.left);
ptop=parseInt(document.getElementById("popup").style.top);
dragxcoor=cx;
dragycoor=cy;
}
function stopDrag() {
clicked = false;
}
function dragBox(evt) {
e = evt || event;
if (clicked == true) {
newx = pleft+e.clientX-dragxcoor;
newy = ptop+e.clientY-dragycoor;
document.getElementById("popup").style.left=newx;
document.getElementById("popup").style.top=newy;
return false;
}
}
document.onmousemove = dragBox;
</script>
<div id="popup" style="left: 0px; top: 0px; position:absolute">
<div class="toolbar" style="z-index:9; display: table; cursor: move;" onmousedown="startDrag(event.clientX,event.clientY)" onmouseup="stopDrag()">
<table style="z-index:9;" width="610" border="0" cellpadding="0" cellspacing="0" align=center valign=top>
<tr>
<td width="500" style="table-layout:fixed;"><font style="font-family:arial;font-size:8pt;color:#EFEFEF;">▦ <strong>dsfocus.co.kr</strong></font></td>
<td width=100%></td>
<td width=11><a href="javascript:void(0)" onclick="document.getElementById('popup').style.display='none'"><font style="font-family:arial;font-size:9pt;color:white;">×</font></a>
</td>
</tr>
</table>
</div>
<div style="padding: 5px;">
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="z-index:9;">
<tr><td>
<?
echo "<iframe name='divif' width='600' height='500' frameborder='0' scrolling='auto' style='z-index:9;'></iframe>";
// 아이프레임 src는 제목링크에서 타겟으로
?>
<hr align="center" width="95%" size="1" color="#CCCCCC">
<p align="center"><a href="javascript:void(0)" onclick="document.getElementById('popup').style.display='none'"><font style="font-family:arial;font-size:9pt;color:#000000;"><strong>[Close]</strong></font></a></p>
</td></tr></table>
</div>
</div>
<!--// div 팝업 //-->
<a href='javascript:void(0);' onclick=\"document.getElementById('popup').style.display = 'block'; divif.location.href='url'>
onclick에서 타겟을 divif(iframe name입니다.)지정하는 방식으로 사용했습니다.
적절히 사용하시면 텝에서도 가능할거 같은데요.
<!--// div 팝업 //-->
<style>
#popup {
position: absolute;
width: 100%;
height: 100%;
display: none;
border: 1px solid gray;
background-color: #FFFFFF;
font: 12px verdana;
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color=#999999, Positive=true);
}
.toolbar {
font: 12px verdana;
border-bottom: 1px solid black;
background-color: #bbbbbb;
padding: 1px;
}
</style>
<script>
clicked = false;
function startDrag(cx,cy) {
clicked = true;
pleft=parseInt(document.getElementById("popup").style.left);
ptop=parseInt(document.getElementById("popup").style.top);
dragxcoor=cx;
dragycoor=cy;
}
function stopDrag() {
clicked = false;
}
function dragBox(evt) {
e = evt || event;
if (clicked == true) {
newx = pleft+e.clientX-dragxcoor;
newy = ptop+e.clientY-dragycoor;
document.getElementById("popup").style.left=newx;
document.getElementById("popup").style.top=newy;
return false;
}
}
document.onmousemove = dragBox;
</script>
<div id="popup" style="left: 0px; top: 0px; position:absolute">
<div class="toolbar" style="z-index:9; display: table; cursor: move;" onmousedown="startDrag(event.clientX,event.clientY)" onmouseup="stopDrag()">
<table style="z-index:9;" width="610" border="0" cellpadding="0" cellspacing="0" align=center valign=top>
<tr>
<td width="500" style="table-layout:fixed;"><font style="font-family:arial;font-size:8pt;color:#EFEFEF;">▦ <strong>dsfocus.co.kr</strong></font></td>
<td width=100%></td>
<td width=11><a href="javascript:void(0)" onclick="document.getElementById('popup').style.display='none'"><font style="font-family:arial;font-size:9pt;color:white;">×</font></a>
</td>
</tr>
</table>
</div>
<div style="padding: 5px;">
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="z-index:9;">
<tr><td>
<?
echo "<iframe name='divif' width='600' height='500' frameborder='0' scrolling='auto' style='z-index:9;'></iframe>";
// 아이프레임 src는 제목링크에서 타겟으로
?>
<hr align="center" width="95%" size="1" color="#CCCCCC">
<p align="center"><a href="javascript:void(0)" onclick="document.getElementById('popup').style.display='none'"><font style="font-family:arial;font-size:9pt;color:#000000;"><strong>[Close]</strong></font></a></p>
</td></tr></table>
</div>
</div>
<!--// div 팝업 //-->
답변에 감사드립니다. 그렇게 하닌깐 more가 먹히는군요
탭방식은 http://sir.co.kr/bbs/board.php?bo_table=g4_skin&wr_id=53151&sca=&sfl=wr_subject&stx=%C5%C7&sop=and
이런 식의 방식을 말씀 드리는 것입니다.
탭방식은 http://sir.co.kr/bbs/board.php?bo_table=g4_skin&wr_id=53151&sca=&sfl=wr_subject&stx=%C5%C7&sop=and
이런 식의 방식을 말씀 드리는 것입니다.
공지사항용-레이어팝업-

휴우

와우~ 디자인 이거야 ~ ㅋ 하지만, 오류난다는...ㅠ.ㅠ
잘 사용하겠습니다.^^

감사합니다^^
잘 쓰겠습니다 감사합니다 ㅎ

