<html>
<head>
<style>
<!--
body,td{font-size:9pt}
//-->
</style>
<script language="javascript">
<!--
var stmnLEFT = 10; // 왼쪽 여백
var stmnGAP1 = 10; // 위쪽 여백
var stmnGAP2 = 10; // 스크롤시 떨어지는 거리
var stmnBASE = 150; //시작위치
var stmnActivateSpeed = 300; //내려오는속도
var stmnScrollSpeed = 10; //스크롤속도
var stmnTimer;
function ReadCookie(name)
{
var label = name + "=";
var labelLen = label.length;
var cLen = document.cookie.length;
var i = 0;
while (i < cLen) {
var j = i + labelLen;
if (document.cookie.substring(i, j) == label) {
var cEnd = document.cookie.indexOf(";", j);
if (cEnd == -1) cEnd = document.cookie.length;
return unescape(document.cookie.substring(j, cEnd));
}
i++;
}
return "";
}
function SaveCookie(name, value, expire)
{
var eDate = new Date();
eDate.setDate(eDate.getDate() + expire);
document.cookie = name + "=" + value + "; expires=" + eDate.toGMTString()+ "; path=/";
}
function RefreshStaticMenu()
{
var stmnStartPoint, stmnEndPoint, stmnRefreshTimer;
stmnStartPoint = parseInt(SDZMENU.style.top, 10);
stmnEndPoint = document.body.scrollTop + stmnGAP2;
if (stmnEndPoint < stmnGAP1) stmnEndPoint = stmnGAP1;
stmnRefreshTimer = stmnActivateSpeed;
if ( stmnStartPoint != stmnEndPoint ) {
stmnScrollAmount = Math.ceil( Math.abs( stmnEndPoint - stmnStartPoint ) / 15 );
SDZMENU.style.top = parseInt(SDZMENU.style.top, 10) + ( ( stmnEndPoint<stmnStartPoint ) ? -stmnScrollAmount : stmnScrollAmount );
stmnRefreshTimer = stmnScrollSpeed;
}
stmnTimer = setTimeout ("RefreshStaticMenu();", stmnRefreshTimer);
}
function ToggleAnimate()
{
if (ANIMATE.checked) {
RefreshStaticMenu();
SaveCookie("ANIMATE", "true", 300);
}
else {
clearTimeout(stmnTimer);
SDZMENU.style.top = stmnGAP1;
SaveCookie("ANIMATE", "false", 300);
}
}
function InitializeStaticMenu()
{
SDZMENU.style.left = stmnLEFT;
if (ReadCookie("ANIMATE") == "false") {
ANIMATE.checked = false;
SDZMENU.style.top = document.body.scrollTop + stmnGAP1;
}
else {
ANIMATE.checked = true;
SDZMENU.style.top = document.body.scrollTop + stmnBASE;
RefreshStaticMenu();
}
}
//-->
</script>
<style type="text/css">table,tr{background style-filter: Alpha(Opacity=40)}body {background:ffffff; background-attachment: fixed; background-image: url(); background-repeat: no-repeat; background-position: 100% 100%}BODY</style></head>
<body onLoad="InitializeStaticMenu();">
<div id="SDZMENU" style="width:150px; height:200px; position:absolute; left:-5000px; top:0px; z-index:100;">
<!---- 메뉴삽입 --->
<table style="border:solid 1px #BBBBBB;" cellpadding="1" cellspacing="1" width="150">
<tr>
<td bgcolor="white" align=center><p>메뉴</p></td>
</tr>
<tr>
<td align=center>
<p><input id="ANIMATE" type="checkbox" onclick="ToggleAnimate();">스크롤 끄기</p>
</td>
</tr>
</table>
</div>
<!------- 여기까지 ------>
<pre>
</pre>
<center> <img src=imge/sunap.jpg>
</pre> </center>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
</body>
</html>
'Javascript' 카테고리의 다른 글
| 스크린 오프닝 수평 슬라이드 스크립트 (0) | 2016.06.02 |
|---|---|
| 이미지 크기를 마우스로 늘렸다 줄였다 (0) | 2016.06.02 |
| 안개가 끼듯 이미지 교체 (0) | 2016.06.01 |
| 장미 (0) | 2016.06.01 |
| 이미지 줌인-아웃 (0) | 2016.06.01 |