스크롤 따라 상하로 움직이는 레이어 정보
스크롤 따라 상하로 움직이는 레이어본문
오류가 나는곳의 주소를 알려주시면 더 빠르고 정확하게 답변 받을 수 있습니다.
오류 주소 :
브라우저의 상하 스크롤을 따라 움직이는 레이어를 만들어 보려고
소스를 찾던 중 아래의 스크립트 소스를 찾았습니다.
그런데 이 소스에는 기능 켜기/끄기 기능이 포함되어 있습니다.
저에게는 필요 없는 부분이라 레이어 안의 테이블 두번째 줄을 지웠습니다.
그랬더니 스크립트 자체가 구동이 안됩니다.
On/Off 기능 없이 무조건 구동되는 스크립트가 필요한데 아래 소스를 어떤식으로 수정하면 될까요.
답변 부탁드리겠습니다.
<소스>
<script language="javascript">
<!--
var stmnLEFT = 10; // 스크롤메뉴의 좌측 위치
var stmnGAP1 = 10; // 페이지 헤더부분의 여백
var stmnGAP2 = 200; // 스크롤시 브라우저 상단과 약간 띄움. 필요없으면 0으로 세팅
var stmnBASE = 100; // 스크롤메뉴 초기 시작위치 (아무렇게나 해도 상관은 없지만 stmnGAP1과 약간 차이를 주는게 보기 좋음)
var stmnActivateSpeed = 0; // 움직임을 감지하는 속도 (숫자가 클수록 늦게 알아차림)
var stmnScrollSpeed = 0; // 스크롤되는 속도 (클수록 늦게 움직임)
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(STATICMENU.style.top, 10);
stmnEndPoint = document.body.scrollTop + stmnGAP2;
stmnLimit = parseInt(window.document.body.scrollHeight) - parseInt(STATICMENU.offsetHeight);
if (stmnEndPoint > stmnLimit) stmnEndPoint = stmnLimit;
if (stmnEndPoint < stmnGAP1) stmnEndPoint = stmnGAP1;
stmnRefreshTimer = stmnActivateSpeed;
if ( stmnStartPoint != stmnEndPoint ) {
stmnScrollAmount = Math.ceil( Math.abs( stmnEndPoint - stmnStartPoint ) / 15 );
STATICMENU.style.top = parseInt(STATICMENU.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);
STATICMENU.style.top = stmnGAP1;
SaveCookie("ANIMATE", "false", 300);
}
}
function InitializeStaticMenu() {
STATICMENU.style.left = stmnLEFT;
if (ReadCookie("ANIMATE") == "false") {
ANIMATE.checked = true;
STATICMENU.style.top = document.body.scrollTop + stmnGAP1;
} else {
ANIMATE.checked = false;
STATICMENU.style.top = document.body.scrollTop + stmnBASE;
RefreshStaticMenu();
}
}
//-->
</script>
<div id="STATICMENU" style="position:absolute;width:150px;height:120px;">
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%" style="border:1 solid #999999;">
<tr>
<td align="center" height="100">
이곳에 메뉴를 넣어주세요.
</td>
</tr>
<tr>
<td align="left" height="20"> <input id="ANIMATE" type="checkbox" onclick="ToggleAnimate();"> 따라다님 끄기</td>
</tr>
</table>
</div>
<script language="javascript">
<!--
InitializeStaticMenu(); // 스크롤메뉴를 가동하는 자바스크립트
//-->
</script>
<br> <!--연습장용 -_-; (스크롤바를 생기게 하려면..)--!>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
오류 주소 :
브라우저의 상하 스크롤을 따라 움직이는 레이어를 만들어 보려고
소스를 찾던 중 아래의 스크립트 소스를 찾았습니다.
그런데 이 소스에는 기능 켜기/끄기 기능이 포함되어 있습니다.
저에게는 필요 없는 부분이라 레이어 안의 테이블 두번째 줄을 지웠습니다.
그랬더니 스크립트 자체가 구동이 안됩니다.
On/Off 기능 없이 무조건 구동되는 스크립트가 필요한데 아래 소스를 어떤식으로 수정하면 될까요.
답변 부탁드리겠습니다.
<소스>
<script language="javascript">
<!--
var stmnLEFT = 10; // 스크롤메뉴의 좌측 위치
var stmnGAP1 = 10; // 페이지 헤더부분의 여백
var stmnGAP2 = 200; // 스크롤시 브라우저 상단과 약간 띄움. 필요없으면 0으로 세팅
var stmnBASE = 100; // 스크롤메뉴 초기 시작위치 (아무렇게나 해도 상관은 없지만 stmnGAP1과 약간 차이를 주는게 보기 좋음)
var stmnActivateSpeed = 0; // 움직임을 감지하는 속도 (숫자가 클수록 늦게 알아차림)
var stmnScrollSpeed = 0; // 스크롤되는 속도 (클수록 늦게 움직임)
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(STATICMENU.style.top, 10);
stmnEndPoint = document.body.scrollTop + stmnGAP2;
stmnLimit = parseInt(window.document.body.scrollHeight) - parseInt(STATICMENU.offsetHeight);
if (stmnEndPoint > stmnLimit) stmnEndPoint = stmnLimit;
if (stmnEndPoint < stmnGAP1) stmnEndPoint = stmnGAP1;
stmnRefreshTimer = stmnActivateSpeed;
if ( stmnStartPoint != stmnEndPoint ) {
stmnScrollAmount = Math.ceil( Math.abs( stmnEndPoint - stmnStartPoint ) / 15 );
STATICMENU.style.top = parseInt(STATICMENU.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);
STATICMENU.style.top = stmnGAP1;
SaveCookie("ANIMATE", "false", 300);
}
}
function InitializeStaticMenu() {
STATICMENU.style.left = stmnLEFT;
if (ReadCookie("ANIMATE") == "false") {
ANIMATE.checked = true;
STATICMENU.style.top = document.body.scrollTop + stmnGAP1;
} else {
ANIMATE.checked = false;
STATICMENU.style.top = document.body.scrollTop + stmnBASE;
RefreshStaticMenu();
}
}
//-->
</script>
<div id="STATICMENU" style="position:absolute;width:150px;height:120px;">
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%" style="border:1 solid #999999;">
<tr>
<td align="center" height="100">
이곳에 메뉴를 넣어주세요.
</td>
</tr>
<tr>
<td align="left" height="20"> <input id="ANIMATE" type="checkbox" onclick="ToggleAnimate();"> 따라다님 끄기</td>
</tr>
</table>
</div>
<script language="javascript">
<!--
InitializeStaticMenu(); // 스크롤메뉴를 가동하는 자바스크립트
//-->
</script>
<br> <!--연습장용 -_-; (스크롤바를 생기게 하려면..)--!>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
댓글 전체

좀 많이 수정하셔야 되는데요
일단
두번째 줄을 지우시고
<input id="ANIMATE" type="hidden" name="ANIMATE"> 를 추가해주세요
그리고 위에 스크립트 함수중에
function InitializeStaticMenu() {
STATICMENU.style.left = stmnLEFT;
STATICMENU.style.top = document.body.scrollTop + stmnBASE;
RefreshStaticMenu();
}
로 바꿔주세요 그럼 되실거에요~ 그럼 수고하세여~* 잘 안되시면 쪽지~
일단
두번째 줄을 지우시고
<input id="ANIMATE" type="hidden" name="ANIMATE"> 를 추가해주세요
그리고 위에 스크립트 함수중에
function InitializeStaticMenu() {
STATICMENU.style.left = stmnLEFT;
STATICMENU.style.top = document.body.scrollTop + stmnBASE;
RefreshStaticMenu();
}
로 바꿔주세요 그럼 되실거에요~ 그럼 수고하세여~* 잘 안되시면 쪽지~
감사합니다