인터넷정보

좌측이나 우측에서 스크롤바 따라다니는 테이블/이미지등

알 수 없는 사용자 2007. 10. 17. 13:53


http://oxtag.com/html/ex/scroll_menu.html

 
<html>

<head>

<script language=JavaScript>
var bNetscape4plus = (navigator.appName == "Netscape" && navigator.appVersion.substring(0,1) >= "4");
var bExplorer4plus = (navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion.substring(0,1) >= "4");
function CheckUIElements()
{
 var yMenuFrom, yMenuTo, yButtonFrom, yButtonTo, yOffset, timeoutNextCheck;
 //yButtonFrom = parseInt (divLinkButton.style.top, 10);
 //yButtonTo = document.body.scrollTop + document.body.clientHeight - 55;
 yMenuFrom = parseInt (bar.style.top, 10);
 yMenuTo = document.body.scrollTop; // 위쪽 위치
 timeoutNextCheck = 500;
 if ( Math.abs (yButtonFrom - (yMenuTo + 152)) < 6 && yButtonTo < yButtonFrom ) {
 setTimeout ("CheckUIElements()", timeoutNextCheck);
 return;
 }
 if ( yButtonFrom != yButtonTo ) {
 yOffset = Math.ceil( Math.abs( yButtonTo - yButtonFrom ) / 10 );
 if ( yButtonTo < yButtonFrom )
 yOffset = -yOffset;
 divLinkButton.style.top = parseInt (divLinkButton.style.top, 10) + yOffset;
 timeoutNextCheck = 10;
 }
 if ( yMenuFrom != yMenuTo ) {
 yOffset = Math.ceil( Math.abs( yMenuTo - yMenuFrom ) / 20 );
 if ( yMenuTo < yMenuFrom )
 yOffset = -yOffset;
 bar.style.top = parseInt (bar.style.top, 10) + yOffset;
 timeoutNextCheck = 10;
 }
 setTimeout ("CheckUIElements()", timeoutNextCheck);
}
function OnLoad()
{
 var y;
 // 프레임 에서 벗어나게 하는 함수입니다. 프레임에 넣으려면 삭제하세요
 if ( top.frames.length )
 // top.location.href = self.location.href;
 // 페에지 로딩시 포지션
 bar.style.top = document.body.scrollTop + 135;
 bar.style.visibility = "visible";
 //divLinkButton.style.top = document.body.scrollTop + document.body.clientHeight - 55;
 //divLinkButton.style.visibility = "visible";
 // initializing UI update timer
 CheckUIElements();
 //if ( bExplorer4plus )
 // setTimeout ( "FlashTitleStepIt(255)", 10 );
 return true;
}
function funcSwapImage(imageName, bHilite) {
// DUMB Netscape doesn't see img names if they're inside a <div which has an id
// if they're just in <div></div> - it's okay, but that's not the case :\
// Workaround (using layers) was provided by Kostya. Tnx man :)
 document.images[imageName].src = "images/" + imageName + (bHilite == 1 ? "_hi.gif" : "_lo.gif");
 return false;
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="15" marginwidth="0" marginheight="0">

<!-- left: 0; 이 부분을 좌측이나 우측에 알맞게 수치를 수정하세요. 현재 0이니까 왼쪽에 맞춰있죠. -->
<!-- 이미지나 여러가지로 응용을 해보세요. 그럼 좀더 멋진 홈을 만들 수 있지 안을까요.            -->
<div id="bar" style="position:absolute; width:10px; height:10px; z-index:1; left: 0; top: 20">

        <!-- 메인메뉴의 투표 테이블 높이와 너비 지정 -->
  <table border=0 width='200' cellspacing='1' cellpadding='2' bgcolor='#A8C4E2' align='center'>
  <tr>
  <td style='word-break:break-all;' bgcolor='white'>
                </td>
  </tr>
  <tr>
  <td height='1' bgcolor='white'>
                </td>
  </tr>
  <tr>
  <td width='100%' style='word-break:break-all;' bgcolor='white'>
  <table border='0' cellspacign='0' cellpadding='0'>
 
   <tr>
   <td><font size=1 face=verdana>1. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>2. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>3. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>4. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>5. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>6. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>7. </td>
   <td></td>
   </tr>
   
   <tr>
   <td><font size=1 face=verdana>8. </td>
   <td></td>
   </tr>
   
  </table>
  </td>
  </tr>
  <tr>
  <td bgcolor='white'></td>
  </tr>
  <tr>
  <td bgcolor='white' align='right'></td>
  </tr>
  <tr>
 
  <td align='center'></td>
 
  </tr>
     </form>
  </table>
 
 <table border=0 width=130>
 <tr><td>
 </td><td align='right'>
  </td></tr>
   <tr><td>
 </td><td align='right'>
  </td></tr>
   <tr><td>
 </td><td align='right'>
  </td></tr>
 </table>
   <table><tr><td>
</td></tr></table>
</div>

<SCRIPT>
OnLoad();
</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><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><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><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br>


</body>
</html>

반응형

'인터넷정보' 카테고리의 다른 글

프레임 사용 Tip  (0) 2007.10.17
마우스 오버시 풍선 도움말(툴팁)  (0) 2007.10.17
마우스 오버시 풍선 도움말(툴팁)  (0) 2007.10.17
비내리는 스크립트  (0) 2007.10.17
비내리는 스크립트  (0) 2007.10.17
좌측이나 우측에서 스크롤바 따라다니는 테이블/이미지등  (0) 2007.10.17
타이틀바 애니메이션 효과  (0) 2007.10.17
타이틀바 애니메이션 효과  (0) 2007.10.17
이미지가 위로 올라가는 소스  (0) 2007.10.17
이미지가 위로 올라가는 소스  (0) 2007.10.17

'인터넷정보'의 다른글

  • 현재글좌측이나 우측에서 스크롤바 따라다니는 테이블/이미지등

관련글

댓글

티스토리툴바