60度 Eadren 网络 >> 设计教程 >> 网页制作 >> Html·Css·特效 >> 特效 >> 页面特效类 >> 正文[打印] [收藏]

一个用图标做的按钮，鼠标放上去自动使页上下移动

作者：生鱼片文章来源：互联网点击数：更新时间：2006-4-10 22:49:12

演示区

脚本说明：

将下面的代码加在<head></head>之间

将下面的代码加在<body></body>之间

#item {position:absolute; visibility:hidden; left:0px}

</style>

<!-- 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>

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

onMouseout="okscroll=false"><img src="http://mbsky.com/java/photo/down.gif" border="0"></a><a href="javascript:void(0)"

onMouseover="okscroll=true; godown=false" onMouseout="okscroll=false"><img src="http://mbsky.com/java/photo/up.gif"

border="0"></a>

将下面的代码加在<body>里(例<body **加代码处**>)

上一篇教程：使你输入的英文字母用日文显示出来，但是不是太好

下一篇教程：页面由大变小，再重新显示内容，非常有动感，值得一用

相关一个用图标做的按钮，鼠标放上去自动使页上下移动的文章：

60度 Eadren 网络 >> 设计教程 >> 网页制作 >> Html·Css·特效 >> 特效 >> 页面特效类 >> 正文[打印] [收藏]

一个用图标做的按钮，鼠标放上去自动使页上下移动

网友评论

全站阅读排行

本类热门教程