當前位置:開發者網絡 >> 網頁特效 >> 頁面導航 >> 內容
精彩推薦
分類最新特效
分類熱點特效
   
鼠標放到相應在文字上就可以實現頁面的上下移動
日期:2004-07-13   人氣:   【字體: 】【收藏此文


<!-- 網頁特效代碼由[中國WEB開發者網絡:http://www.ChinaWebDev.com]提供! -->
<!-- 要實現此效果需要 2 個步驟: -->

<!-- 第 1 步: -->
<!-- 把下面的代碼加到<HEAD></HEAD>區域中: -->

<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-70;

item.pixelTop=w_y+document.body.scrollTop-50;

}

}

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>




<!-- 第 2 步: -->
<!-- 把下面的代碼加到<BODY></BODY>區域中: -->

<div id="item">

<a href="javascript:void(0)" onMouseover="okscroll=true; godown=true"

onMouseout="okscroll=false">向上</a><a

href="javascript:void(0)"

onMouseover="okscroll=true; godown=false" onMouseout="okscroll=false">向下</a>

</div>