当前位置:首页 > 设计在线 > 网页设计 > CSS/Xhtml > DHTML实现可控制的页面内滚动区域

DHTML实现可控制的页面内滚动区域

点击次数:23 次 发布日期:2008-11-26 22:44:09 作者:源代码网
源代码网推荐  首先,我们在样式表里加入“.opacity {FILTER: alpha(opacity=100)”,看下面!
源代码网推荐
<style type="text/css"> 
源代码网推荐<!-- 
源代码网推荐.opacity {FILTER: alpha(opacity=100)} 
源代码网推荐--> 
源代码网推荐</style> 
源代码网推荐
源代码网推荐然后在html代码中加入: 
源代码网推荐
源代码网推荐<script> 
源代码网推荐function movstar(a,time){ 
源代码网推荐movx=setInterval("mov("+a+")",time) 
源代码网推荐
源代码网推荐function movover(){ 
源代码网推荐clearInterval(movx) 
源代码网推荐
源代码网推荐function mov(a){ 
源代码网推荐scrollx=new_date.document.body.scrollLeft 
源代码网推荐scrolly=new_date.document.body.scrollTop 
源代码网推荐scrolly=scrolly+a 
源代码网推荐new_date.window.scroll(scrollx,scrolly) 
源代码网推荐
源代码网推荐function o_down(theobject){ 
源代码网推荐object=theobject 
源代码网推荐while(object.filters.alpha.opacity>60){ 
源代码网推荐object.filters.alpha.opacity+=-10} 
源代码网推荐
源代码网推荐function o_up(theobject){ 
源代码网推荐object=theobject 
源代码网推荐while(object.filters.alpha.opacity<100){ 
源代码网推荐object.filters.alpha.opacity+=10} 
源代码网推荐
源代码网推荐function wback(){ 
源代码网推荐if(new_date.history.length==0){window.history.back()} 
源代码网推荐else{new_date.history.back()} 
源代码网推荐
源代码网推荐</script> 


源代码网推荐然后在向上箭头图片的代码中加入“class="opacity" onMouseDown=movover();movstar(-3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(-1,20);o_down(this) onMouseUp=movover();movstar(-1,20) alt="点住不放可以快速向上滚动"”。

如下所示:
源代码网推荐
源代码网推荐<img src="http://www.zzchn.com/edu/20071027/images/up.gif" width=19 height=27 class="opacity" onMouseDown=movover();movstar(-3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(-1,20);o_down(this)onMouseUp=movover();movstar(-1,20) alt="点住不放可以快速向上滚动">
源代码网推荐
源代码网推荐这就是控制文字向上滚动的代码,当鼠标移动到up.gif图片上时文字向上滚动,按动箭头文字会加快向上滚动速度。
源代码网推荐
源代码网推荐向下箭头图片的制作方法同上。在代码中加入“class="opacity" onMouseDown=movover();movstar(3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(1,20);o_down(this) onMouseUp=movover();movstar(1,20) alt="点住不放可以快速向下滚动"”。
源代码网推荐
源代码网推荐如下所示:
源代码网推荐
源代码网推荐<img src="http://www.zzchn.com/edu/20071027/images/down.gif" width=19 height=19 class="opacity" onMouseDown=movover();movstar(3,2) onMouseOut=movover();o_up(this) onMouseOver=movstar(1,20);o_down(this) onMouseUp=movover();movstar(1,20) alt="点住不放可以快速向下滚动">
源代码网推荐
源代码网推荐之后在要显示文字的区域加上以下这段代码:
源代码网推荐
源代码网推荐<iframe border=0 frameborder=0 framespacing=0 height=120 marginheight=0 marginwidth=0 name=new_date noResize scrolling=no src="http://www.zzchn.com/edu/20071027/iframe.htm" width=200 vspale="0"></iframe>
源代码网推荐
源代码网推荐连接一个叫http://www.zzchn.com/edu/20071027/iframe.htm的页面。其中height=120 width=200控制http://www.zzchn.com/edu/20071027/iframe.htm页面在当前页面的显示面积大小。编辑http://www.zzchn.com/edu/20071027/iframe.htm文件,放入你要更新的内容就行了。


源代码网供稿.
网友评论 (0)
会员中心
设计在线
本站推荐
设计在线之精华