栏目搜索
 
 
 
 
你的位置:首页 > JavaScript > 卷帘一样的文字显示效果,为你的网页增加不少生色哦! >
 

卷帘一样的文字显示效果,为你的网页增加不少生色哦!

发布者:[本站编辑] | 来源:[]

卷帘一样的文字显示效果,为你的网页增加不少生色哦!_电脑维修资料库


<!doctype html public -//w3c//dtd html 4.0 transitional//en>
<html><head><title>卷帘一样的文字显示效果,为你的网页增加不少生色哦!</title>
<style>.a1 {
 color: #000080; font-family: ms sans-serif; text-decoration: none
}
.a1:hover {
 cursor: hand; color: #ff2200; font-family: ms sans-serif; text-decoration: none
}
.a2 {
 color: #000080; font-family: ms sans-serif; text-decoration: none
}
.a2:hover {
 cursor: hand; color: #ff2200; font-family: ms sans-serif; text-decoration: underline
}
div.cltopmenu {
 z-index: 31; visibility: hidden; width: 80px; clip: rect(0px 80px 14px 0px); position: absolute; height: 150px; background-color: #eeeeee; layer-background-color: #eeeeee
}
div.cltopmenubottom {
 z-index: 2; width: 80px; clip: rect(0px 80px 3px 0px); position: absolute; top: 21px; height: 3px; background-color: #cecfce; layer-background-color: #cecfce
}
div.cltopmenutext {
 font-size: 11px; z-index: 1; left: 5px; width: 80px; font-family: arial,helvetica; position: absolute; top: 21px; background-color: #eeeeee
}
</style>

<script>
/********************************************************************************
copyright (c) 1999 thomas brattli
this script is made by and copyrighted to thomas brattli at www.bratta.com
********************************************************************************
browsercheck:*/
ie=document.all?1:0
n=document.layers?1:0
//how many menus do you have? (remember to copy and add divs in the body if you add menus)
var numberofmenus=1
//the width on the menus (set the width in the stylesheet as well)
var mwidth=90
//pixels between the menus
var pxbetween=10
//the first menus left position
var fromleft=120
//the top position of the menus
var fromtop=300
//the bgcolor of the bottom mouseover div
var bgcolor='#cecfce'
//the bgcolor to change to
var bgcolorchangeto='#6380bc'
//the position the mouseover line div will stop at when going up!
var imageheight=21
/***************************************************************************
do not change anything below this line!
****************************************************************************/
//object constructor
function makenewsmenu(obj,nest){
 nest=(!nest) ? ':'document.'+nest+'.'     
 this.css=(n) ? eval(nest+'document.'+obj):eval('document.all.'+obj+'.style') 
 this.scrollheight=n?this.css.document.height:eval('document.all.'+obj+'.offsetheight')
 this.moveit=b_moveit;this.bgchange=b_bgchange;
 this.slideup=b_slideup; this.slidedown=b_slidedown;
 this.clipto=b_clipto;
    this.obj = obj + object;  eval(this.obj + =this)  
}
//objects methods
function b_moveit(x,y){this.x=x; this.y=y; this.css.left=this.x; this.css.top=this.y}
function b_bgchange(color){if(ie) this.css.backgroundcolor=color; else this.css.bgcolor=color}
function b_clipto(t,r,b,l){
 if(n){this.css.clip.top=t; this.css.clip.right=r; this.css.clip.bottom=b; this.css.clip.left=l
 }else this.css.clip=rect(+t+,+r+,+b+,+l+);
}
function b_slideup(ystop,moveby,speed,fn,wh){
 if(!this.slideactive){
  if(this.y>ystop){
   this.moveit(this.x,this.y-5); eval(wh)
   settimeout(this.obj+.slideup(+ystop+,+moveby+,+speed+,'+fn+','+wh+'),speed)
  }else{
   this.slideactive=false; this.moveit(0,ystop); eval(fn)
  }
 }
}
function b_slidedown(ystop,moveby,speed,fn,wh){
 if(!this.slideactive){
  if(this.y<ystop){
   this.moveit(this.x,this.y+5); eval(wh)
   settimeout(this.obj+.slidedown(+ystop+,+moveby+,+speed+,'+fn+','+wh+'),speed)
  }else{
   this.slideactive=false; this.moveit(0,ystop); eval(fn)
  }
 }
}
//initiating the page, making cross-browser objects
function newsmenuinit(){
 otopmenu=new array()
 for(i=0;i<=numberofmenus;i++){
  otopmenu=new array()
  otopmenu<0>=new makenewsmenu('divtopmenu'+i)
  otopmenu<1>=new makenewsmenu('divtopmenubottom'+i,'divtopmenu'+i)
  otopmenu<2>=new makenewsmenu('divtopmenutext'+i,'divtopmenu'+i)
  otopmenu<1>.moveit(0,imageheight)
  otopmenu<0>.clipto(0,mwidth,imageheight+3,0)
  otopmenu<0>.moveit(i*mwidth+fromleft+(i*pxbetween),fromtop)
  otopmenu<0>.css.visibility=visible
 }
}
//moves the menu
function topmenu(num){
 if(otopmenu<1>.y==imageheight) otopmenu<1>.slidedown(otopmenu<2>.scrollheight+20,10,40,'otopmenu<'+num+'><0>.clipto(0,mwidth,otopmenu<'+num+'><1>.y+3,0)','otopmenu<'+num+'><0>.clipto(0,mwidth,otopmenu<'+num+'><1>.y+3,0)')
 else if(otopmenu<1>.y==otopmenu<2>.scrollheight+20) otopmenu<1>.slideup(imageheight,10,40,'otopmenu<'+num+'><0>.clipto(0,mwidth,otopmenu<'+num+'><1>.y+3,0)','otopmenu<'+num+'><0>.clipto(0,mwidth,otopmenu<'+num+'><1>.y+3,0)')
}
//changes background onmouseover
function menuover(num){otopmenu<1>.bgchange(bgcolorchangeto)}
function menuout(num){otopmenu<1>.bgchange(bgcolor)}
//calls the init function onload
onload=newsmenuinit;
</script>
</head>

<body bgcolor=#ffffff text=#000000>
 <div class=cltopmenu id=divtopmenu0><a onmouseover=menuover(0)
            onclick=topmenu(0); if(ie)this.blur(); return false
            onmouseout=menuout(0)
            href=#><img alt=
            src=logo.gif
            width=86 align=top border=0></a>
            <div class=cltopmenutext id=divtopmenutext0
            style=width: 75px; height: 112px>欢迎访问无忧脚本 <a
            href=51js.com'>http://www.51js.com>51js.com </a>  </div>
            <div class=cltopmenubottom id=divtopmenubottom0></div></div>
            <div class=cltopmenu id=divtopmenu1><a onmouseover=menuover(1)
            onclick=topmenu(1); if(ie)this.blur(); return false
            onmouseout=menuout(1)
            href=#><img
           alt=
            src=logo.gif
            width=86 align=top border=0></a>
            <div class=cltopmenutext id=divtopmenutext1
            style=width: 75px; height: 112px>把我们的网站加入了收藏夹没有呢? <a
            href=#>51js.com</a> 也可要记得我们的网址啊 51js.com! </div>
            <div class=cltopmenubottom id=divtopmenubottom1></div></div>
           

</body>
</html>

</t

 
返回列表 返回JavaScript