| 首页 >> 网络编程 >> JAVASCRIPT >> 新闻正文 | [字体：大 中 小] [打印文档] |
| |
|
status = ''; //okscroll与godown都是滚动状态标志，其值由指示器层的onmouseover与onmouseout2个事件控制。 //window.scrollBy(x,y)控制页面滚动，x、y分别表示横向与纵向滚动的距离，单位是象素px。 //当设置y值更大时，每次滚动的距离也将更大。 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()', 158); } //页面加载后，启动相关脚本函数 //设置页面加载后，首先启动init函数 window.onload=init; //设置当窗口大小发生变换时启动的函数 (isNS) ? window.onresize=resizeNS : window.onresize=getwindowsize ; // End -- > < /SCRIPT > < BODY > <!--用div标记定义一个层，从而可以在脚本程序中对它进行控制--> <!--接着，给指示器图像添加2个事件，当它们发生时，分别设置相应的操作状态变量--> < DIV id=item >< A onmouseover="okscroll=true; godown=true;" onmouseout=okscroll=false href="javascript:void(0)" >< IMG src="down.gif" border=0 >< /A >< A onmouseover="okscroll=true; godown=false;" onmouseout=okscroll=false href="javascript:void(0)" >< IMG src="up.gif" border=0 >< /A > < /DIV > < P > <!--以下是页面内容，写得长一些，从而能看到操作效果--> < CENTER >◆◆◆◆◆ Begin From Here ◆◆◆◆◆ < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >用JavaScript制作页面滚动效果 < P >◆◆◆◆◆ End Here ◆◆◆◆◆ < P >< /CENTER > < P >< /P >< /BODY >< /HTML > 演示效果 OK！看了上面的代码详细解读，你是否领会了其中的技巧？软件真是无所不能，是吗？ |
