滚动条样式收集

用图片来代替iframe滚动条↑↓

用图片来代替iframe滚动条↑↓


用下列代码替换网页的<title>..</title>
<SCRIPT LANGUAGE="javascript">
function scroll(n)
{temp=n;
Out1.scrollTop=Out1.scrollTop+temp;
if (temp==0) return;
setTimeout("scroll(temp)",80);
}
</SCRIPT>
<TABLE WIDTH="330">
<TR>
<TD WIDTH="304" VALIGN="TOP" ROWSPAN="2" >
<DIV ID=Out1 STYLE="width:100%; height:100;overflow: hidden ;border-style:dashed;border-width: 1px,1px,1px,1px;">
文字<BR> 文字<BR>
文字<BR>
文字<BR>
文字
<BR>
<BR>
</DIV>
</TD>
<TD WIDTH="14" VALIGN="TOP"><IMG SRC="photo/up0605.gif" WIDTH="14" HEIGHT="20" script_onmouseover="scroll(-1)" script_onmouseout="scroll(0)" script_onmousedown="scroll(-3)" BORDER="0" ALT="按下鼠标速度会更快!"></TD>
</TR>
<TR>
<TD WIDTH="14" VALIGN="BOTTOM"><IMG SRC="photo/down0605.gif" script_onmouseover="scroll(1)" script_onmouseout="scroll(0)"  script_onmousedown="scroll(3)" BORDER="0" WIDTH="15" HEIGHT="21" ALT="按下鼠标速度会更快!"></TD>
</TR>
</TABLE>



<DIV>
<STYLE>
BODY { SCROLLBAR-ARROW-COLOR:#FFFF66;
SCROLLBAR-FACE-COLOR:#FF66FF;
SCROLLBAR-DARKSHADOW-COLOR:#CCCCFF;
SCROLLBAR-HIGHLIGHT-COLOR:#CCFF99;
SCROLLBAR-3DLIGHT-COLOR:#FF66FF;
SCROLLBAR-SHADOW-COLOR:#CCFF99;
SCROLLBAR-TRACK-COLOR:#33CCFF;}
</STYLE>
</DIV>



//控制滚动条样式
BODY 
{
SCROLLBAR-FACE-COLOR
:#F7F7F7;
SCROLLBAR-HIGHLIGHT-COLOR
:#FFFFFF;
SCROLLBAR-SHADOW-COLOR
:#FFFFFF;
SCROLLBAR-3DLIGHT-COLOR
:#D4D0C8;
SCROLLBAR-ARROW-COLOR
:#808080;
SCROLLBAR-TRACK-COLOR
:#FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR
:#D4D0C8;
}


//按钮或文本框
.btn 
{
 background-color
: #efefef;
 border-top
: 1px solid #dfdfdf;
 border-right
: 1px solid #666666;
 border-bottom
: 1px solid #666666;
 border-left
: 1px solid #dfdfdf;
}

//控制td样式
td 
{font-size: 12px;color: #333333; line-height: 19px}



CSS  Scrollbar  Properties        滚动条属性  
 
   
Scrollbar  Properties  
属性  CSS  Version  
版本  Compatibility  
兼容性  Inherit  From  Parent  
继承性  Description  
简介    
scrollbar-3d-light-color  IE专有属性  IE5.5+  有  设置或检索滚动条亮边框颜色    
scrollbar-highlight-color  IE专有属性  IE5.5+  有  设置或检索滚动条3D界面的亮边(ThreedHighlight)颜色    
scrollbar-face-color  IE专有属性  IE5.5+  有  设置或检索滚动条3D表面(ThreedFace)的颜色    
scrollbar-arrow-color  IE专有属性  IE5.5+  有  设置或检索滚动条方向箭头的颜色    
scrollbar-shadow-color  IE专有属性  IE5.5+  有  设置或检索滚动条3D界面的暗边(ThreedShadow)颜色    
scrollbar-dark-shadow-color  IE专有属性  IE5.5+  有  设置或检索滚动条暗边框(ThreedDarkShadow)颜色    
scrollbar-base-color  IE专有属性  IE5.5+  有  设置或检索滚动条基准颜色。其它界面颜色将据此自动调整    
 
   
   
   
说明:这种颜色是CSS2标准属性。这种颜色是IE建议样式表属性。这种颜色是NS私有属性。这种颜色是目前尚无浏览器支持的属性。  
---------------------------------------------------------------  
 
<style  type="text/css">  
BODY  
{  
           scrollbar-face-color:  #DEE3E7;  
           scrollbar-highlight-color:  #FFFFFF;  
           scrollbar-shadow-color:  #DEE3E7;  
           scrollbar-3dlight-color:  #D1D7DC;  
           scrollbar-arrow-color:    #006699;  
           scrollbar-track-color:  #EFEFEF;  
           scrollbar-darkshadow-color:  #98AAB1;  

 background-color: #AA1612;            
}  
</style>  
---------------------------------------------------------------  
 
样式要写在被iframe装入的页面中,或用js修改body标记的属性





一、预览效果:

二、代码
Test.html

<IFRAME border=0 name=ye_xy marginWidth=0 frameSpacing=0 marginHeight=0 src="Test1.html" frameBorder=0 noResize width="100%" scrolling=auto height="100%" vspale="0"></IFRAME>


Test1.html

<html>
<head>
<STYLE type=text/css>
BODY 
{
 SCROLLBAR-FACE-COLOR
: #e8e7e7; 
 SCROLLBAR-HIGHLIGHT-COLOR
: #ffffff; 
 SCROLLBAR-SHADOW-COLOR
: #ffffff; 
 SCROLLBAR-3DLIGHT-COLOR
: #cccccc; 
 SCROLLBAR-ARROW-COLOR
: #03B7EC; 
 SCROLLBAR-TRACK-COLOR
: #EFEFEF; 
 SCROLLBAR-DARKSHADOW-COLOR
: #b2b2b2; 
 SCROLLBAR-BASE-COLOR
: #000000;
}

</STYLE>
</head>
<body>
<TABLE  cellSpacing=1 cellPadding=2 width="100%" border=0>
<TBODY>
<TR bgColor=#ffffff>
<TD>
<P>本着平等互利的原则,加加联盟—三部 日付短信联盟网站和用户达成如下协议:(加加联盟—三部 日付短信联盟网站以下简称“加加联盟—三部”)<br>
  
<br>
  一、合作方基本条件 
<br>
  1. 符合“中国计算机信息网络相关政策法规”及中华人民共和国其他各项法律法规的合法个人网站或大中小ICP;
<br>
  2. 有兴趣致力于IT行业,了解互联网、计算机相关服务,具备提供互联网服务的基本知识和技能; 
<br>
  3. 具有良好声誉,并且拥有一定数量的客户群;11882205 
<br>
  4. 有代理合作意向的企、事业单位。 
<br>
  
<p>十一、争议解决<br>
  与本合作有关的一切争议,双方应通过协商方式友好解决;如协商未果,应将争议提交仲裁委员会进行仲裁,该仲裁是终局的并对双方均有约束力。 
</p>
<P><B>如出现上述问题,我们将视情节分别给予警告、停止广告投放、扣发应得分成、冻结帐号等不同程度的处理。影响严重的,我们亦会保留进一步法律责任追究的权利。请各位合作方自觉遵守!</B> 我们的目标是:<FONT color=#ff0000>共同盈利,互惠双赢!</FONT>本合作最终解释权归加加联盟—三部联盟所有。<br>
  
<br>
   加加联盟—三部联盟欢迎用户对加加联盟—三部联盟服务条款给予评论或提出质疑。加加联盟—三部联盟将根据网站发展的需求和技术的发展不断完善本服务条款。请将与本服务条款有关的所有评论或疑问发往客服QQ:121351877,谢谢!
</P>
</TD></TR></TBODY></TABLE>
</body>
</html>
posted @ 2007-03-08 23:15  QDuck  阅读(6335)  评论(0编辑  收藏  举报