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

时间:2008-10-06 10:28:11  来源:第二电脑网上收集  作者:

  第二电脑网导读:gt;  </style>  然后在html代码中加入:  <script>  function movstar(a,time){  movx=setInterval("mov("+a+")",time)  }  function movover(){  clearInterval(movx)  }  function mov(a){  s...
  正文: 首先,我们在样式表里加入“.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="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="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="iframe.htm" width=200 vspale="0"></iframe>

连接一个叫iframe.htm的页面。其中height=120 width=200控制iframe.htm页面在当前页面的显示面积大小。编辑iframe.htm文件,放入你要更新的内容就行了。

DHTML实现可控制的页面内滚动区域》由第二电脑网原创提供,转载请注明:http://www.002pc.com/master/College/Page/HTML/2008-10-06/1606.html


关键字:

关于《DHTML实现可控制的页面内滚动区域》文章的评论

站内搜索: 高级搜索

热门搜索: Windows style 系统 tr IP QQ CPU 安装 function 注册 if td