iget
2001-06-19, 12:14 AM
範例網頁：
http://home.pchome.com.tw/home/iget1/godown.html
評比等級：三顆星
範例網頁下載：
http://home.pchome.com.tw/home/iget1/godown.zip
使用時機：只要網頁有超過一頁的長度，即可適用
原始碼：以下原碼放在</head>之前
步驟一：<style type=text/css>
<!--
body {SCROLLBAR-FACE-COLOR: #F6F6F6; SCROLLBAR-HIGHLIGHT-COLOR: #F6F6F6; SCROLLBAR-SHADOW-COLOR: #F6F6F6; SCROLLBAR-3DLIGHT-COLOR: #9999FF; SCROLLBAR-ARROW-COLOR: #9999FF; SCROLLBAR-TRACK-COLOR: #F6F6F6; SCROLLBAR-DARKSHADOW-COLOR: #9999FF;}
#item {position:absolute; visibility:hidden; left:0px}
-->
</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var isNS=(document.layers);
var _all=(isNS)? '' : 'all.' ;
var _style=(isNS)? '' : '.style' ;
var _visible=(isNS)? 'show' : 'visible';
var w_x, w_y, item, okscroll=false, godown;
function init(){
item=eval('document.'+_all+'item'+_style);
getwindowsize();
item.visibility=_visible;
scrollpage();
}
function getwindowsize() {
w_x=(isNS)? window.innerWidth-5 : document.body.clientWidth;
w_y=(isNS)? window.innerHeight : document.body.clientHeight;
(isNS)? item.clip.width=42: item.width=42;
(isNS)? item.clip.height=20 : item.height=20;
moveitem();
}
function resizeNS() {
setTimeout('document.location.reload()',400);
}
function moveitem() {
if (isNS) {
item.moveTo((pageXOffset+w_x-70),(w_y+pageYOffset-50))
}else{
item.pixelLeft=document.body.scrollLeft+w_x-50;
item.pixelTop=w_y+document.body.scrollTop-230;
}
}
window.onload=init;
(isNS) ? window.onresize=resizeNS : window.onresize=getwindowsize ;
function scrollpage() {
status = '';
if (okscroll) {
if (godown) {
(isNS)? window.scrollBy(0,4) : window.scrollBy(0,4) ;
} else {
(isNS)? window.scrollBy(0,-4) : window.scrollBy(0,-4) ;
}
}
moveitem();
setTimeout('scrollpage()', 40);
}
// End -->
</script>
步驟二：以下原碼放在<BODY>之後
<div id="item">
<a href="javascript:void(0)" onMouseover="okscroll=true; godown=true" onMouseout="okscroll=false"><img src="icon_go_down.gif" border="0"></a>
<a href="javascript:void(0)" onMouseover="okscroll=true; godown=false" onMouseout="okscroll=false"><img src="icon_go_up.gif" border="0"></a>
</div>
註：其中的黑體字部分，大家可以改看看就知道囉:)
贊助商連結
http://home.pchome.com.tw/home/iget1/godown.html
評比等級：三顆星
範例網頁下載：
http://home.pchome.com.tw/home/iget1/godown.zip
使用時機：只要網頁有超過一頁的長度，即可適用
原始碼：以下原碼放在</head>之前
步驟一：<style type=text/css>
<!--
body {SCROLLBAR-FACE-COLOR: #F6F6F6; SCROLLBAR-HIGHLIGHT-COLOR: #F6F6F6; SCROLLBAR-SHADOW-COLOR: #F6F6F6; SCROLLBAR-3DLIGHT-COLOR: #9999FF; SCROLLBAR-ARROW-COLOR: #9999FF; SCROLLBAR-TRACK-COLOR: #F6F6F6; SCROLLBAR-DARKSHADOW-COLOR: #9999FF;}
#item {position:absolute; visibility:hidden; left:0px}
-->
</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var isNS=(document.layers);
var _all=(isNS)? '' : 'all.' ;
var _style=(isNS)? '' : '.style' ;
var _visible=(isNS)? 'show' : 'visible';
var w_x, w_y, item, okscroll=false, godown;
function init(){
item=eval('document.'+_all+'item'+_style);
getwindowsize();
item.visibility=_visible;
scrollpage();
}
function getwindowsize() {
w_x=(isNS)? window.innerWidth-5 : document.body.clientWidth;
w_y=(isNS)? window.innerHeight : document.body.clientHeight;
(isNS)? item.clip.width=42: item.width=42;
(isNS)? item.clip.height=20 : item.height=20;
moveitem();
}
function resizeNS() {
setTimeout('document.location.reload()',400);
}
function moveitem() {
if (isNS) {
item.moveTo((pageXOffset+w_x-70),(w_y+pageYOffset-50))
}else{
item.pixelLeft=document.body.scrollLeft+w_x-50;
item.pixelTop=w_y+document.body.scrollTop-230;
}
}
window.onload=init;
(isNS) ? window.onresize=resizeNS : window.onresize=getwindowsize ;
function scrollpage() {
status = '';
if (okscroll) {
if (godown) {
(isNS)? window.scrollBy(0,4) : window.scrollBy(0,4) ;
} else {
(isNS)? window.scrollBy(0,-4) : window.scrollBy(0,-4) ;
}
}
moveitem();
setTimeout('scrollpage()', 40);
}
// End -->
</script>
步驟二：以下原碼放在<BODY>之後
<div id="item">
<a href="javascript:void(0)" onMouseover="okscroll=true; godown=true" onMouseout="okscroll=false"><img src="icon_go_down.gif" border="0"></a>
<a href="javascript:void(0)" onMouseover="okscroll=true; godown=false" onMouseout="okscroll=false"><img src="icon_go_up.gif" border="0"></a>
</div>
註：其中的黑體字部分，大家可以改看看就知道囉:)
贊助商連結