글 수 109
2
조회 수 : 50505 신고 : 0
![title: [ani]깜빡이는 표정](http://web.webmini.net/./files/iconshop/74a37aadbde84c591808859b369e85e0.gif "title : [ani]깜빡이는 표정")
빽짱구| 미리보기 : |
|---|
소스가 좀긴데 잘보고 사용하세요.[#레이어001_]
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
var home="http://suldo.zotta.net";
var link1="http://suldo.zotta.net/nolink.html";
var link2="http://my.dreamwiz.com/blue8199/news/";
var link3="http://www.monodesign.co.kr/monoshop/index.php";
if (document.referrer.indexOf(home)==-1 && document.referrer.indexOf(link1)==-1
&& document.referrer.indexOf(link2)==-1
&& document.referrer.indexOf(link3)==-1)
{
if (document.referrer)
{
alert(" 경고!!nn당신은 지금 무단링크된 주소로 연결을 시도하였습니다.n무단링크 : "+document.referrer+"n잠시후에 메인페이지로 이동합니다.");
window.location=home;
}
else
{
alert("반드시 홈페이지를 통해서 연결되어야 합니다..");
window.location=home;
}
}
</script>
<title>수정해야할부분은 ♣표시로 주석설명을 달아놨어요.</title>
<style type="text/css">
.window {
background-color: #c0c0c0;
border-color: #f0f0f0 #606060 #404040 #d0d0d0;
border-style: solid;
border-width: 2px;
margin: 0px;
padding: 2px;
position: absolute;
text-align: left;
visibility: hidden;
}
.titleBar {
background-color: #eeeeee; <!-- ♣타이틀바 배경색-->
cursor: default;
color: #ffffff;
font-family: "MS Sans Serif", "Arial", "Helvetica", sans-serif;
font-size: 8pt;
font-weight: bold;
margin: 0px;
padding: 2px;
text-align: right;
white-space: nowrap;
width: auto;
}
.titleBarText {
float: left;
overflow: hidden;
padding-left: 6px;
text-align: left;
}
.titleBarButtons {
border-style: none;
vertical-align: middle;
width: 42px;
height: 14px;
}
.clientArea {
background-color: #ffffff;
border-color: #404040 #e0e0e0 #f0f0f0 #505050;
border-style: solid;
border-width: 2px;
color: #000000;
font-family: "Arial", "Helvetica", sans-serif;
font-size: 10pt;
margin: 0px;
margin-top: 2px;
overflow: auto;
padding: 8px;
}
</style>
<script type="text/javascript">
// Determine browser type (Netscape 6.0/6.1+ or IE 5.5/6.0).
var isIE5 = (navigator.userAgent.indexOf("MSIE 5.5") > 0 |
navigator.userAgent.indexOf("MSIE 6.0") > 0) ? 1 : 0;
var isNS6 = (navigator.userAgent.indexOf("Gecko") > 0) ? 1 : 0;
var isNS6p0 = (navigator.userAgent.indexOf("6.0") > 0) ? 1 : 0 & isNS6;
//=============================================================================
// Window Object
//=============================================================================
function Window(el) {
var i, mapList, mapName;
// Get window components.
this.frame = el;
this.titleBar = winFindByClassName(el, "titleBar");
this.titleBarText = winFindByClassName(el, "titleBarText");
this.titleBarButtons = winFindByClassName(el, "titleBarButtons");
this.clientArea = winFindByClassName(el, "clientArea");
// Find matching button image map.
mapName = this.titleBarButtons.useMap.substr(1);
mapList = document.getElementsByTagName("MAP");
for (i = 0; i < mapList.length; i++)
if (mapList[i].name == mapName)
this.titleBarMap = mapList[i];
// Save colors.
this.activeFrameBackgroundColor = this.frame.style.backgroundColor;
this.activeFrameBorderColor = this.frame.style.borderColor;
this.activeTitleBarColor = this.titleBar.style.backgroundColor;
this.activeTitleTextColor = this.titleBar.style.color;
this.activeClientAreaBorderColor = this.clientArea.style.borderColor;
if (isIE5)
this.activeClientAreaScrollbarColor = this.clientArea.style.scrollbarBaseColor;
// Save images.
this.activeButtonsImage = this.titleBarButtons.src;
this.inactiveButtonsImage = this.titleBarButtons.lowsrc;
// Set flags.
this.isOpen = false;
this.isMinimized = false;
// Set methods.
this.open = winOpen;
this.close = winClose;
this.minimize = winMinimize;
this.restore = winRestore;
this.makeActive = winMakeActive;
// Set up event handling.
this.frame.parentWindow = this;
this.frame.onmousemove = winResizeCursorSet;
this.frame.onmouseout = winResizeCursorRestore;
this.frame.onmousedown = winResizeDragStart;
this.titleBar.parentWindow = this;
this.titleBar.onmousedown = winMoveDragStart;
this.clientArea.parentWindow = this;
this.clientArea.onclick = winClientAreaClick;
for (i = 0; i < this.titleBarMap.childNodes.length; i++)
if (this.titleBarMap.childNodes[i].tagName == "AREA")
this.titleBarMap.childNodes[i].parentWindow = this;
// For IE, fix client area display by setting a width.
if (isIE5)
this.clientArea.style.width = "100%";
// Open and minimize the window so resize limits can be found. Window is
// immediately restored and closed afterwards.
this.open();
this.minimize();
this.minimumWidth = this.frame.offsetWidth;
this.minimumHeight = 1;
this.titleBarText.style.width = "";
this.textLimit = this.frame.offsetWidth;
this.restore();
this.close();
}
//=============================================================================
// Window Methods
//=============================================================================
function winOpen() {
if (this.isOpen)
return;
this.makeActive();
this.isOpen = true; // flag as "open" so restore() will work.
if (this.isMinimized)
this.restore();
this.frame.style.visibility = "visible";
}
function winClose() {
this.frame.style.visibility = "hidden";
this.isOpen = false;
}
function winMinimize() {
if (!this.isOpen || this.isMinimized)
return;
this.makeActive();
// Save current frame and title text widths.
this.restoreWidth = this.frame.style.width;
this.oldTextWidth = this.titleBarText.style.width;
// Hide client area and minimize window frame and title text widths.
this.clientArea.style.display = "none";
if (this.minimumWidth)
this.frame.style.width = this.minimumWidth + "px";
else
this.frame.style.width = "";
this.titleBarText.style.width = winCtrl.minimizedTextWidth + "px";
this.isMinimized = true;
}
function winRestore() {
if (!this.isOpen || !this.isMinimized)
return;
this.makeActive();
this.titleBarText.style.width = this.oldTextWidth;
this.clientArea.style.display = "";
this.frame.style.width = this.restoreWidth;
this.isMinimized = false;
}
function winMakeActive() {
if (winCtrl.active == this)
return;
// Inactivate the currently active window.
if (winCtrl.active) {
winCtrl.active.frame.style.backgroundColor = winCtrl.inactiveFrameBackgroundColor;
winCtrl.active.frame.style.borderColor = winCtrl.inactiveFrameBorderColor;
winCtrl.active.titleBar.style.backgroundColor = winCtrl.inactiveTitleBarColor;
winCtrl.active.titleBar.style.color = winCtrl.inactiveTitleTextColor;
winCtrl.active.clientArea.style.borderColor = winCtrl.inactiveClientAreaBorderColor;
if (isIE5)
winCtrl.active.clientArea.style.scrollbarBaseColor = winCtrl.inactiveClientAreaScrollbarColor;
if (isNS6p0)
winCtrl.active.clientArea.style.overflow = "hidden";
if (winCtrl.active.inactiveButtonsImage)
winCtrl.active.titleBarButtons.src = winCtrl.active.inactiveButtonsImage;
}
// Activate this window.
this.frame.style.backgroundColor = this.activeFrameBackgroundColor;
this.frame.style.borderColor = this.activeFrameBorderColor;
this.titleBar.style.backgroundColor = this.activeTitleBarColor;
this.titleBar.style.color = this.activeTitleTextColor;
this.clientArea.style.borderColor = this.activeClientAreaBorderColor;
if (isIE5)
this.clientArea.style.scrollbarBaseColor = this.activeClientAreaScrollbarColor;
if (isNS6p0)
this.clientArea.style.overflow = "auto";
if (this.inactiveButtonsImage)
this.titleBarButtons.src = this.activeButtonsImage;
this.frame.style.zIndex = ++winCtrl.maxzIndex;
winCtrl.active = this;
}
//=============================================================================
// Event handlers.
//=============================================================================
function winClientAreaClick(event) {
// Make this window the active one.
this.parentWindow.makeActive();
}
//-----------------------------------------------------------------------------
// Window dragging.
//-----------------------------------------------------------------------------
function winMoveDragStart(event) {
var target;
var x, y;
if (isIE5)
target = window.event.srcElement.tagName;
if (isNS6)
target = event.target.tagName;
if (target == "AREA")
return;
this.parentWindow.makeActive();
// Get cursor offset from window frame.
if (isIE5) {
x = window.event.x;
y = window.event.y;
}
if (isNS6) {
x = event.pageX;
y = event.pageY;
}
winCtrl.xOffset = winCtrl.active.frame.offsetLeft - x;
winCtrl.yOffset = winCtrl.active.frame.offsetTop - y;
// Set document to capture mousemove and mouseup events.
if (isIE5) {
document.onmousemove = winMoveDragGo;
document.onmouseup = winMoveDragStop;
}
if (isNS6) {
document.addEventListener("mousemove", winMoveDragGo, true);
document.addEventListener("mouseup", winMoveDragStop, true);
event.preventDefault();
}
winCtrl.inMoveDrag = true;
}
function winMoveDragGo(event) {
var x, y;
if (!winCtrl.inMoveDrag)
return;
// Get cursor position.
if (isIE5) {
x = window.event.x;
y = window.event.y;
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (isNS6) {
x = event.pageX;
y = event.pageY;
event.preventDefault();
}
// Move window frame based on offset from cursor.
winCtrl.active.frame.style.left = (x + winCtrl.xOffset) + "px";
winCtrl.active.frame.style.top = (y + winCtrl.yOffset) + "px";
}
function winMoveDragStop(event) {
winCtrl.inMoveDrag = false;
// Remove mousemove and mouseup event captures on document.
if (isIE5) {
document.onmousemove = null;
document.onmouseup = null;
}
if (isNS6) {
document.removeEventListener("mousemove", winMoveDragGo, true);
document.removeEventListener("mouseup", winMoveDragStop, true);
}
}
//-----------------------------------------------------------------------------
// Window resizing.
//-----------------------------------------------------------------------------
function winResizeCursorSet(event) {
var target;
var xOff, yOff;
if (this.parentWindow.isMinimized || winCtrl.inResizeDrag)
return;
// If not on window frame, restore cursor and exit.
if (isIE5)
target = window.event.srcElement;
if (isNS6)
target = event.target;
if (target != this.parentWindow.frame)
return;
// Find resize direction.
if (isIE5) {
xOff = window.event.offsetX;
yOff = window.event.offsetY;
}
if (isNS6) {
xOff = event.layerX;
yOff = event.layerY;
}
winCtrl.resizeDirection = ""
if (yOff <= winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "n";
else if (yOff >= this.parentWindow.frame.offsetHeight - winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "s";
if (xOff <= winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "w";
else if (xOff >= this.parentWindow.frame.offsetWidth - winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "e";
// If not on window edge, restore cursor and exit.
if (winCtrl.resizeDirection == "") {
this.onmouseout(event);
return;
}
// Change cursor.
if (isIE5)
document.body.style.cursor = winCtrl.resizeDirection + "-resize";
if (isNS6)
this.parentWindow.frame.style.cursor = winCtrl.resizeDirection + "-resize";
}
function winResizeCursorRestore(event) {
if (winCtrl.inResizeDrag)
return;
// Restore cursor.
if (isIE5)
document.body.style.cursor = "";
if (isNS6)
this.parentWindow.frame.style.cursor = "";
}
function winResizeDragStart(event) {
var target;
// Make sure the event is on the window frame.
if (isIE5)
target = window.event.srcElement;
if (isNS6)
target = event.target;
if (target != this.parentWindow.frame)
return;
this.parentWindow.makeActive();
if (this.parentWindow.isMinimized)
return;
// Save cursor position.
if (isIE5) {
winCtrl.xPosition = window.event.x;
winCtrl.yPosition = window.event.y;
}
if (isNS6) {
winCtrl.xPosition = event.pageX;
winCtrl.yPosition = event.pageY;
}
// Save window postion and size.
winCtrl.oldLeft = parseInt(this.parentWindow.frame.style.left, 10);
winCtrl.oldTop = parseInt(this.parentWindow.frame.style.top, 10);
winCtrl.oldWidth = parseInt(this.parentWindow.frame.style.width, 10);
winCtrl.oldHeight = parseInt(this.parentWindow.clientArea.style.height, 10);
// Set document to capture mousemove and mouseup events.
if (isIE5) {
document.onmousemove = winResizeDragGo;
document.onmouseup = winResizeDragStop;
}
if (isNS6) {
document.addEventListener("mousemove", winResizeDragGo, true);
document.addEventListener("mouseup" , winResizeDragStop, true);
event.preventDefault();
}
winCtrl.inResizeDrag = true;
}
function winResizeDragGo(event) {
var north, south, east, west;
var dx, dy;
var w, h;
if (!winCtrl.inResizeDrag)
return;
// Set direction flags based on original resize direction.
north = false;
south = false;
east = false;
west = false;
if (winCtrl.resizeDirection.charAt(0) == "n")
north = true;
if (winCtrl.resizeDirection.charAt(0) == "s")
south = true;
if (winCtrl.resizeDirection.charAt(0) == "e" || winCtrl.resizeDirection.charAt(1) == "e")
east = true;
if (winCtrl.resizeDirection.charAt(0) == "w" || winCtrl.resizeDirection.charAt(1) == "w")
west = true;
// Find change in cursor position.
if (isIE5) {
dx = window.event.x - winCtrl.xPosition;
dy = window.event.y - winCtrl.yPosition;
}
if (isNS6) {
dx = event.pageX - winCtrl.xPosition;
dy = event.pageY - winCtrl.yPosition;
}
// If resizing north or west, reverse corresponding amount.
if (west)
dx = -dx;
if (north)
dy = -dy;
// Check new size.
w = winCtrl.oldWidth + dx;
h = winCtrl.oldHeight + dy;
if (w <= winCtrl.active.minimumWidth) {
w = winCtrl.active.minimumWidth;
dx = w - winCtrl.oldWidth;
}
if (h <= winCtrl.active.minimumHeight) {
h = winCtrl.active.minimumHeight;
dy = h - winCtrl.oldHeight;
}
// Resize the window.
if (east || west)
winCtrl.active.frame.style.width = w + "px";
if (north || south)
winCtrl.active.clientArea.style.height = h + "px";
// Clip the title bar text, if necessary.
if (east || west) {
if (w <= winCtrl.active.textLimit)
winCtrl.active.titleBarText.style.width = (winCtrl.minimizedTextWidth + w - winCtrl.active.minimumWidth) + "px";
else
winCtrl.active.titleBarText.style.width = "";
}
// For a north or west resize, move the window.
if (west)
winCtrl.active.frame.style.left = (winCtrl.oldLeft - dx) + "px";
if (north)
winCtrl.active.frame.style.top = (winCtrl.oldTop - dy) + "px";
if (isIE5) {
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (isNS6)
event.preventDefault();
}
function winResizeDragStop(event) {
winCtrl.inResizeDrag = false;
// Remove mousemove and mouseup event captures on document.
if (isIE5) {
document.onmousemove = null;
document.onmouseup = null;
}
if (isNS6) {
document.removeEventListener("mousemove", winResizeDragGo, true);
document.removeEventListener("mouseup" , winResizeDragStop, true);
}
}
//=============================================================================
// Utility functions.
//=============================================================================
function winFindByClassName(el, className) {
var i, tmp;
if (el.className == className)
return el;
// Search for a descendant element assigned the given class.
for (i = 0; i < el.childNodes.length; i++) {
tmp = winFindByClassName(el.childNodes[i], className);
if (tmp != null)
return tmp;
}
return null;
}
//=============================================================================
// Initialization code.
//=============================================================================
var winList = new Array();
var winCtrl = new Object();
function winInit() {
var elList;
// Initialize window control object.
winCtrl.maxzIndex = 0;
winCtrl.resizeCornerSize = 16;
winCtrl.minimizedTextWidth = 100;
winCtrl.inactiveFrameBackgroundColor = "#c0c0c0";
winCtrl.inactiveFrameBorderColor = "#f0f0f0 #505050 #404040 #e0e0e0";
winCtrl.inactiveTitleBarColor = "#808080";
winCtrl.inactiveTitleTextColor = "#c0c0c0";
winCtrl.inactiveClientAreaBorderColor = "#404040 #e0e0e0 #f0f0f0 #505050";
winCtrl.inactiveClientAreaScrollbarColor = "";
winCtrl.inMoveDrag = false;
winCtrl.inResizeDrag = false;
// Initialize windows, build list and find starting maximum z-index.
elList = document.getElementsByTagName("DIV");
for (var i = 0; i < elList.length; i++) {
if (elList[i].className == "window")
winList[elList[i].id] = new Window(elList[i]);
if (elList[i].zIndex && elList[i].zIndex > winCtrl.maxzIndex)
winCtrl.maxzIndex = elList[i].zIndex;
}
}
window.onload = winInit; // run initialization code after page loads.
</script>
</head>
<body>
<!-- Normal page content. -->
<p>
<a href="" onclick="if (winList['sample1']) winList['sample1'].open(); return false;">Window 1</a>
|
<a href="" onclick="if (winList['sample2']) winList['sample2'].open(); return false;">Window 2</a>
</p>
<!--♣첫번째 윈도우 오브젝트 -->
<div id="sample1" class="window" style="left:50px;top:150px;width:450px;filter:"><!--♣초기 윈도우 크기(마우스로 조절가능)-->
<div class="titleBar">
<span class="titleBarText">SULDO</span> <!--♣타이틀바 텍스트-->
<img class="titleBarButtons" alt="" hidefocus=true src="buttons.gif" usemap="#sampleMap1">
<map name="sampleMap1">
<area shape="rect" coords="0,0,13,13" href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;">
<area shape="rect" coords="14,0,27,13" href="" alt="" title="Restore" onclick="this.parentWindow.restore();return false;">
<area shape="rect" coords="28,0,41,13" href="" alt="" title="Close" onclick="this.parentWindow.close();return false;">
</map><!--♣map부분은 수정안해도 됩니다;;-->
</div>
<div class="clientArea" style="height:200px; background-color:#eeeeee;">
♣ 여기다가 본문을 쓰세요. 무쟈게 길게 써도 옆에 스크롤바가 생기게 되기 때문에 상관없네요^^ 두번째 윈도우를 열어보세요..;
</div>
</div>
<!--♣두번째 윈도우 오브젝트 -->
<div id="sample2" class="window" style="left:200px;top:100px;width:275px;"><!--♣초기 윈도우 크기(마우스로 조절가능)-->
<div class="titleBar">
<span class="titleBarText">SULDO</span><!--♣타이틀바 텍스트-->
<img class="titleBarButtons" alt="" hidefocus=true src="buttons.gif" usemap="#sampleMap2">
<map name="sampleMap2">
<area shape="rect" coords="0,0,13,13" href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;">
<area shape="rect" coords="14,0,27,13" href="" alt="" title="Restore" onclick="this.parentWindow.restore();return false;">
<area shape="rect" coords="28,0,41,13" href="" alt="" title="Close" onclick="this.parentWindow.close();return false;">
</map><!--♣map부분은 수정안해도 됩니다;;-->
</div>
<div class="clientArea" style="height:175px;">
해석 좀 해바요..ㅡㅡ;
<h3>The Conqueror Worm</h3>
<i>By Edgar Allan Poe</i>
<p>Lo! 'tis a gala night<br>
Within the lonesome latter years!<br>
An angel throng, bewinged, bedight<br>
In veils, and drowned in tears,<br>
Sit in a theatre, to see<br>
A play of hopes and fears,<br>
While the orchestra breathes fitfully<br>
The music of the spheres.</p>
<p>Mimes, in the form of God on high,<br>
Mutter and mumble low,<br>
And hither and thither fly-<br>
Mere puppets they, who come and go<br>
At bidding of vast formless things<br>
That shift the scenery to and fro,<br>
Flapping from out their Condor wings<br>
Invisible Woe!</p>
<p>That motley drama- oh, be sure<br>
It shall not be forgot!<br>
With its Phantom chased for evermore,<br>
By a crowd that seize it not,<br>
Through a circle that ever returneth in<br>
To the self-same spot,<br>
And much of Madness, and more of Sin,<br>
And Horror the soul of the plot.</p>
<p>But see, amid the mimic rout<br>
A crawling shape intrude!<br>
A blood-red thing that writhes from out<br>
The scenic solitude!<br>
It writhes!- it writhes!- with mortal pangs<br>
The mimes become its food,<br>
And seraphs sob at vermin fangs<br>
In human gore imbued.</p>
<p>Out- out are the lights- out all!<br>
And, over each quivering form,<br>
The curtain, a funeral pall,<br>
Comes down with the rush of a storm,<br>
While the angels, all pallid and wan,<br>
Uprising, unveiling, affirm<br>
That the play is the tragedy, "Man,"<br>
And its hero the Conqueror Worm.</p>
<p>-THE END-</p>
</div>
</div>
</body>
</html>[_레이어001#]
출처: 술도넷
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
var home="http://suldo.zotta.net";
var link1="http://suldo.zotta.net/nolink.html";
var link2="http://my.dreamwiz.com/blue8199/news/";
var link3="http://www.monodesign.co.kr/monoshop/index.php";
if (document.referrer.indexOf(home)==-1 && document.referrer.indexOf(link1)==-1
&& document.referrer.indexOf(link2)==-1
&& document.referrer.indexOf(link3)==-1)
{
if (document.referrer)
{
alert(" 경고!!nn당신은 지금 무단링크된 주소로 연결을 시도하였습니다.n무단링크 : "+document.referrer+"n잠시후에 메인페이지로 이동합니다.");
window.location=home;
}
else
{
alert("반드시 홈페이지를 통해서 연결되어야 합니다..");
window.location=home;
}
}
</script>
<title>수정해야할부분은 ♣표시로 주석설명을 달아놨어요.</title>
<style type="text/css">
.window {
background-color: #c0c0c0;
border-color: #f0f0f0 #606060 #404040 #d0d0d0;
border-style: solid;
border-width: 2px;
margin: 0px;
padding: 2px;
position: absolute;
text-align: left;
visibility: hidden;
}
.titleBar {
background-color: #eeeeee; <!-- ♣타이틀바 배경색-->
cursor: default;
color: #ffffff;
font-family: "MS Sans Serif", "Arial", "Helvetica", sans-serif;
font-size: 8pt;
font-weight: bold;
margin: 0px;
padding: 2px;
text-align: right;
white-space: nowrap;
width: auto;
}
.titleBarText {
float: left;
overflow: hidden;
padding-left: 6px;
text-align: left;
}
.titleBarButtons {
border-style: none;
vertical-align: middle;
width: 42px;
height: 14px;
}
.clientArea {
background-color: #ffffff;
border-color: #404040 #e0e0e0 #f0f0f0 #505050;
border-style: solid;
border-width: 2px;
color: #000000;
font-family: "Arial", "Helvetica", sans-serif;
font-size: 10pt;
margin: 0px;
margin-top: 2px;
overflow: auto;
padding: 8px;
}
</style>
<script type="text/javascript">
// Determine browser type (Netscape 6.0/6.1+ or IE 5.5/6.0).
var isIE5 = (navigator.userAgent.indexOf("MSIE 5.5") > 0 |
navigator.userAgent.indexOf("MSIE 6.0") > 0) ? 1 : 0;
var isNS6 = (navigator.userAgent.indexOf("Gecko") > 0) ? 1 : 0;
var isNS6p0 = (navigator.userAgent.indexOf("6.0") > 0) ? 1 : 0 & isNS6;
//=============================================================================
// Window Object
//=============================================================================
function Window(el) {
var i, mapList, mapName;
// Get window components.
this.frame = el;
this.titleBar = winFindByClassName(el, "titleBar");
this.titleBarText = winFindByClassName(el, "titleBarText");
this.titleBarButtons = winFindByClassName(el, "titleBarButtons");
this.clientArea = winFindByClassName(el, "clientArea");
// Find matching button image map.
mapName = this.titleBarButtons.useMap.substr(1);
mapList = document.getElementsByTagName("MAP");
for (i = 0; i < mapList.length; i++)
if (mapList[i].name == mapName)
this.titleBarMap = mapList[i];
// Save colors.
this.activeFrameBackgroundColor = this.frame.style.backgroundColor;
this.activeFrameBorderColor = this.frame.style.borderColor;
this.activeTitleBarColor = this.titleBar.style.backgroundColor;
this.activeTitleTextColor = this.titleBar.style.color;
this.activeClientAreaBorderColor = this.clientArea.style.borderColor;
if (isIE5)
this.activeClientAreaScrollbarColor = this.clientArea.style.scrollbarBaseColor;
// Save images.
this.activeButtonsImage = this.titleBarButtons.src;
this.inactiveButtonsImage = this.titleBarButtons.lowsrc;
// Set flags.
this.isOpen = false;
this.isMinimized = false;
// Set methods.
this.open = winOpen;
this.close = winClose;
this.minimize = winMinimize;
this.restore = winRestore;
this.makeActive = winMakeActive;
// Set up event handling.
this.frame.parentWindow = this;
this.frame.onmousemove = winResizeCursorSet;
this.frame.onmouseout = winResizeCursorRestore;
this.frame.onmousedown = winResizeDragStart;
this.titleBar.parentWindow = this;
this.titleBar.onmousedown = winMoveDragStart;
this.clientArea.parentWindow = this;
this.clientArea.onclick = winClientAreaClick;
for (i = 0; i < this.titleBarMap.childNodes.length; i++)
if (this.titleBarMap.childNodes[i].tagName == "AREA")
this.titleBarMap.childNodes[i].parentWindow = this;
// For IE, fix client area display by setting a width.
if (isIE5)
this.clientArea.style.width = "100%";
// Open and minimize the window so resize limits can be found. Window is
// immediately restored and closed afterwards.
this.open();
this.minimize();
this.minimumWidth = this.frame.offsetWidth;
this.minimumHeight = 1;
this.titleBarText.style.width = "";
this.textLimit = this.frame.offsetWidth;
this.restore();
this.close();
}
//=============================================================================
// Window Methods
//=============================================================================
function winOpen() {
if (this.isOpen)
return;
this.makeActive();
this.isOpen = true; // flag as "open" so restore() will work.
if (this.isMinimized)
this.restore();
this.frame.style.visibility = "visible";
}
function winClose() {
this.frame.style.visibility = "hidden";
this.isOpen = false;
}
function winMinimize() {
if (!this.isOpen || this.isMinimized)
return;
this.makeActive();
// Save current frame and title text widths.
this.restoreWidth = this.frame.style.width;
this.oldTextWidth = this.titleBarText.style.width;
// Hide client area and minimize window frame and title text widths.
this.clientArea.style.display = "none";
if (this.minimumWidth)
this.frame.style.width = this.minimumWidth + "px";
else
this.frame.style.width = "";
this.titleBarText.style.width = winCtrl.minimizedTextWidth + "px";
this.isMinimized = true;
}
function winRestore() {
if (!this.isOpen || !this.isMinimized)
return;
this.makeActive();
this.titleBarText.style.width = this.oldTextWidth;
this.clientArea.style.display = "";
this.frame.style.width = this.restoreWidth;
this.isMinimized = false;
}
function winMakeActive() {
if (winCtrl.active == this)
return;
// Inactivate the currently active window.
if (winCtrl.active) {
winCtrl.active.frame.style.backgroundColor = winCtrl.inactiveFrameBackgroundColor;
winCtrl.active.frame.style.borderColor = winCtrl.inactiveFrameBorderColor;
winCtrl.active.titleBar.style.backgroundColor = winCtrl.inactiveTitleBarColor;
winCtrl.active.titleBar.style.color = winCtrl.inactiveTitleTextColor;
winCtrl.active.clientArea.style.borderColor = winCtrl.inactiveClientAreaBorderColor;
if (isIE5)
winCtrl.active.clientArea.style.scrollbarBaseColor = winCtrl.inactiveClientAreaScrollbarColor;
if (isNS6p0)
winCtrl.active.clientArea.style.overflow = "hidden";
if (winCtrl.active.inactiveButtonsImage)
winCtrl.active.titleBarButtons.src = winCtrl.active.inactiveButtonsImage;
}
// Activate this window.
this.frame.style.backgroundColor = this.activeFrameBackgroundColor;
this.frame.style.borderColor = this.activeFrameBorderColor;
this.titleBar.style.backgroundColor = this.activeTitleBarColor;
this.titleBar.style.color = this.activeTitleTextColor;
this.clientArea.style.borderColor = this.activeClientAreaBorderColor;
if (isIE5)
this.clientArea.style.scrollbarBaseColor = this.activeClientAreaScrollbarColor;
if (isNS6p0)
this.clientArea.style.overflow = "auto";
if (this.inactiveButtonsImage)
this.titleBarButtons.src = this.activeButtonsImage;
this.frame.style.zIndex = ++winCtrl.maxzIndex;
winCtrl.active = this;
}
//=============================================================================
// Event handlers.
//=============================================================================
function winClientAreaClick(event) {
// Make this window the active one.
this.parentWindow.makeActive();
}
//-----------------------------------------------------------------------------
// Window dragging.
//-----------------------------------------------------------------------------
function winMoveDragStart(event) {
var target;
var x, y;
if (isIE5)
target = window.event.srcElement.tagName;
if (isNS6)
target = event.target.tagName;
if (target == "AREA")
return;
this.parentWindow.makeActive();
// Get cursor offset from window frame.
if (isIE5) {
x = window.event.x;
y = window.event.y;
}
if (isNS6) {
x = event.pageX;
y = event.pageY;
}
winCtrl.xOffset = winCtrl.active.frame.offsetLeft - x;
winCtrl.yOffset = winCtrl.active.frame.offsetTop - y;
// Set document to capture mousemove and mouseup events.
if (isIE5) {
document.onmousemove = winMoveDragGo;
document.onmouseup = winMoveDragStop;
}
if (isNS6) {
document.addEventListener("mousemove", winMoveDragGo, true);
document.addEventListener("mouseup", winMoveDragStop, true);
event.preventDefault();
}
winCtrl.inMoveDrag = true;
}
function winMoveDragGo(event) {
var x, y;
if (!winCtrl.inMoveDrag)
return;
// Get cursor position.
if (isIE5) {
x = window.event.x;
y = window.event.y;
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (isNS6) {
x = event.pageX;
y = event.pageY;
event.preventDefault();
}
// Move window frame based on offset from cursor.
winCtrl.active.frame.style.left = (x + winCtrl.xOffset) + "px";
winCtrl.active.frame.style.top = (y + winCtrl.yOffset) + "px";
}
function winMoveDragStop(event) {
winCtrl.inMoveDrag = false;
// Remove mousemove and mouseup event captures on document.
if (isIE5) {
document.onmousemove = null;
document.onmouseup = null;
}
if (isNS6) {
document.removeEventListener("mousemove", winMoveDragGo, true);
document.removeEventListener("mouseup", winMoveDragStop, true);
}
}
//-----------------------------------------------------------------------------
// Window resizing.
//-----------------------------------------------------------------------------
function winResizeCursorSet(event) {
var target;
var xOff, yOff;
if (this.parentWindow.isMinimized || winCtrl.inResizeDrag)
return;
// If not on window frame, restore cursor and exit.
if (isIE5)
target = window.event.srcElement;
if (isNS6)
target = event.target;
if (target != this.parentWindow.frame)
return;
// Find resize direction.
if (isIE5) {
xOff = window.event.offsetX;
yOff = window.event.offsetY;
}
if (isNS6) {
xOff = event.layerX;
yOff = event.layerY;
}
winCtrl.resizeDirection = ""
if (yOff <= winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "n";
else if (yOff >= this.parentWindow.frame.offsetHeight - winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "s";
if (xOff <= winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "w";
else if (xOff >= this.parentWindow.frame.offsetWidth - winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "e";
// If not on window edge, restore cursor and exit.
if (winCtrl.resizeDirection == "") {
this.onmouseout(event);
return;
}
// Change cursor.
if (isIE5)
document.body.style.cursor = winCtrl.resizeDirection + "-resize";
if (isNS6)
this.parentWindow.frame.style.cursor = winCtrl.resizeDirection + "-resize";
}
function winResizeCursorRestore(event) {
if (winCtrl.inResizeDrag)
return;
// Restore cursor.
if (isIE5)
document.body.style.cursor = "";
if (isNS6)
this.parentWindow.frame.style.cursor = "";
}
function winResizeDragStart(event) {
var target;
// Make sure the event is on the window frame.
if (isIE5)
target = window.event.srcElement;
if (isNS6)
target = event.target;
if (target != this.parentWindow.frame)
return;
this.parentWindow.makeActive();
if (this.parentWindow.isMinimized)
return;
// Save cursor position.
if (isIE5) {
winCtrl.xPosition = window.event.x;
winCtrl.yPosition = window.event.y;
}
if (isNS6) {
winCtrl.xPosition = event.pageX;
winCtrl.yPosition = event.pageY;
}
// Save window postion and size.
winCtrl.oldLeft = parseInt(this.parentWindow.frame.style.left, 10);
winCtrl.oldTop = parseInt(this.parentWindow.frame.style.top, 10);
winCtrl.oldWidth = parseInt(this.parentWindow.frame.style.width, 10);
winCtrl.oldHeight = parseInt(this.parentWindow.clientArea.style.height, 10);
// Set document to capture mousemove and mouseup events.
if (isIE5) {
document.onmousemove = winResizeDragGo;
document.onmouseup = winResizeDragStop;
}
if (isNS6) {
document.addEventListener("mousemove", winResizeDragGo, true);
document.addEventListener("mouseup" , winResizeDragStop, true);
event.preventDefault();
}
winCtrl.inResizeDrag = true;
}
function winResizeDragGo(event) {
var north, south, east, west;
var dx, dy;
var w, h;
if (!winCtrl.inResizeDrag)
return;
// Set direction flags based on original resize direction.
north = false;
south = false;
east = false;
west = false;
if (winCtrl.resizeDirection.charAt(0) == "n")
north = true;
if (winCtrl.resizeDirection.charAt(0) == "s")
south = true;
if (winCtrl.resizeDirection.charAt(0) == "e" || winCtrl.resizeDirection.charAt(1) == "e")
east = true;
if (winCtrl.resizeDirection.charAt(0) == "w" || winCtrl.resizeDirection.charAt(1) == "w")
west = true;
// Find change in cursor position.
if (isIE5) {
dx = window.event.x - winCtrl.xPosition;
dy = window.event.y - winCtrl.yPosition;
}
if (isNS6) {
dx = event.pageX - winCtrl.xPosition;
dy = event.pageY - winCtrl.yPosition;
}
// If resizing north or west, reverse corresponding amount.
if (west)
dx = -dx;
if (north)
dy = -dy;
// Check new size.
w = winCtrl.oldWidth + dx;
h = winCtrl.oldHeight + dy;
if (w <= winCtrl.active.minimumWidth) {
w = winCtrl.active.minimumWidth;
dx = w - winCtrl.oldWidth;
}
if (h <= winCtrl.active.minimumHeight) {
h = winCtrl.active.minimumHeight;
dy = h - winCtrl.oldHeight;
}
// Resize the window.
if (east || west)
winCtrl.active.frame.style.width = w + "px";
if (north || south)
winCtrl.active.clientArea.style.height = h + "px";
// Clip the title bar text, if necessary.
if (east || west) {
if (w <= winCtrl.active.textLimit)
winCtrl.active.titleBarText.style.width = (winCtrl.minimizedTextWidth + w - winCtrl.active.minimumWidth) + "px";
else
winCtrl.active.titleBarText.style.width = "";
}
// For a north or west resize, move the window.
if (west)
winCtrl.active.frame.style.left = (winCtrl.oldLeft - dx) + "px";
if (north)
winCtrl.active.frame.style.top = (winCtrl.oldTop - dy) + "px";
if (isIE5) {
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (isNS6)
event.preventDefault();
}
function winResizeDragStop(event) {
winCtrl.inResizeDrag = false;
// Remove mousemove and mouseup event captures on document.
if (isIE5) {
document.onmousemove = null;
document.onmouseup = null;
}
if (isNS6) {
document.removeEventListener("mousemove", winResizeDragGo, true);
document.removeEventListener("mouseup" , winResizeDragStop, true);
}
}
//=============================================================================
// Utility functions.
//=============================================================================
function winFindByClassName(el, className) {
var i, tmp;
if (el.className == className)
return el;
// Search for a descendant element assigned the given class.
for (i = 0; i < el.childNodes.length; i++) {
tmp = winFindByClassName(el.childNodes[i], className);
if (tmp != null)
return tmp;
}
return null;
}
//=============================================================================
// Initialization code.
//=============================================================================
var winList = new Array();
var winCtrl = new Object();
function winInit() {
var elList;
// Initialize window control object.
winCtrl.maxzIndex = 0;
winCtrl.resizeCornerSize = 16;
winCtrl.minimizedTextWidth = 100;
winCtrl.inactiveFrameBackgroundColor = "#c0c0c0";
winCtrl.inactiveFrameBorderColor = "#f0f0f0 #505050 #404040 #e0e0e0";
winCtrl.inactiveTitleBarColor = "#808080";
winCtrl.inactiveTitleTextColor = "#c0c0c0";
winCtrl.inactiveClientAreaBorderColor = "#404040 #e0e0e0 #f0f0f0 #505050";
winCtrl.inactiveClientAreaScrollbarColor = "";
winCtrl.inMoveDrag = false;
winCtrl.inResizeDrag = false;
// Initialize windows, build list and find starting maximum z-index.
elList = document.getElementsByTagName("DIV");
for (var i = 0; i < elList.length; i++) {
if (elList[i].className == "window")
winList[elList[i].id] = new Window(elList[i]);
if (elList[i].zIndex && elList[i].zIndex > winCtrl.maxzIndex)
winCtrl.maxzIndex = elList[i].zIndex;
}
}
window.onload = winInit; // run initialization code after page loads.
</script>
</head>
<body>
<!-- Normal page content. -->
<p>
<a href="" onclick="if (winList['sample1']) winList['sample1'].open(); return false;">Window 1</a>
|
<a href="" onclick="if (winList['sample2']) winList['sample2'].open(); return false;">Window 2</a>
</p>
<!--♣첫번째 윈도우 오브젝트 -->
<div id="sample1" class="window" style="left:50px;top:150px;width:450px;filter:"><!--♣초기 윈도우 크기(마우스로 조절가능)-->
<div class="titleBar">
<span class="titleBarText">SULDO</span> <!--♣타이틀바 텍스트-->
<img class="titleBarButtons" alt="" hidefocus=true src="buttons.gif" usemap="#sampleMap1">
<map name="sampleMap1">
<area shape="rect" coords="0,0,13,13" href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;">
<area shape="rect" coords="14,0,27,13" href="" alt="" title="Restore" onclick="this.parentWindow.restore();return false;">
<area shape="rect" coords="28,0,41,13" href="" alt="" title="Close" onclick="this.parentWindow.close();return false;">
</map><!--♣map부분은 수정안해도 됩니다;;-->
</div>
<div class="clientArea" style="height:200px; background-color:#eeeeee;">
♣ 여기다가 본문을 쓰세요. 무쟈게 길게 써도 옆에 스크롤바가 생기게 되기 때문에 상관없네요^^ 두번째 윈도우를 열어보세요..;
</div>
</div>
<!--♣두번째 윈도우 오브젝트 -->
<div id="sample2" class="window" style="left:200px;top:100px;width:275px;"><!--♣초기 윈도우 크기(마우스로 조절가능)-->
<div class="titleBar">
<span class="titleBarText">SULDO</span><!--♣타이틀바 텍스트-->
<img class="titleBarButtons" alt="" hidefocus=true src="buttons.gif" usemap="#sampleMap2">
<map name="sampleMap2">
<area shape="rect" coords="0,0,13,13" href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;">
<area shape="rect" coords="14,0,27,13" href="" alt="" title="Restore" onclick="this.parentWindow.restore();return false;">
<area shape="rect" coords="28,0,41,13" href="" alt="" title="Close" onclick="this.parentWindow.close();return false;">
</map><!--♣map부분은 수정안해도 됩니다;;-->
</div>
<div class="clientArea" style="height:175px;">
해석 좀 해바요..ㅡㅡ;
<h3>The Conqueror Worm</h3>
<i>By Edgar Allan Poe</i>
<p>Lo! 'tis a gala night<br>
Within the lonesome latter years!<br>
An angel throng, bewinged, bedight<br>
In veils, and drowned in tears,<br>
Sit in a theatre, to see<br>
A play of hopes and fears,<br>
While the orchestra breathes fitfully<br>
The music of the spheres.</p>
<p>Mimes, in the form of God on high,<br>
Mutter and mumble low,<br>
And hither and thither fly-<br>
Mere puppets they, who come and go<br>
At bidding of vast formless things<br>
That shift the scenery to and fro,<br>
Flapping from out their Condor wings<br>
Invisible Woe!</p>
<p>That motley drama- oh, be sure<br>
It shall not be forgot!<br>
With its Phantom chased for evermore,<br>
By a crowd that seize it not,<br>
Through a circle that ever returneth in<br>
To the self-same spot,<br>
And much of Madness, and more of Sin,<br>
And Horror the soul of the plot.</p>
<p>But see, amid the mimic rout<br>
A crawling shape intrude!<br>
A blood-red thing that writhes from out<br>
The scenic solitude!<br>
It writhes!- it writhes!- with mortal pangs<br>
The mimes become its food,<br>
And seraphs sob at vermin fangs<br>
In human gore imbued.</p>
<p>Out- out are the lights- out all!<br>
And, over each quivering form,<br>
The curtain, a funeral pall,<br>
Comes down with the rush of a storm,<br>
While the angels, all pallid and wan,<br>
Uprising, unveiling, affirm<br>
That the play is the tragedy, "Man,"<br>
And its hero the Conqueror Worm.</p>
<p>-THE END-</p>
</div>
</div>
</body>
</html>[_레이어001#]
출처: 술도넷
글쓴이 빽짱구
단점이 없는 사람은 장점도 거의 없다 - 에이브러햄 링컨
소중한 댓글 부탁드립니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시
아이콘이 붙게됩니다.
추천수 10단위당 메달이 1개씩 노출되고, 추천수에 따라 배경색이 변하며, 일정수의 추천수를 받을시
아이콘이 붙게됩니다.
첫번째 댓글을 남겨주세요!
- 추천수 50개이상
- 추천수 30개이상
- 추천수 20개이상
- 추천수 10개이상
- 추천수 3개이상
닫기