一、隐藏所有滚动条 [转自：711网络工作室 http://www.tc711.com]
既然厌倦了，就让它隐藏起来吧： [转自：711网络工作室 http://www.tc711.com]
<body scroll="no">或<body style="overflow:hidden">
二、隐藏纵、横向滚动条
如果要隐藏某个方向上的滚动条该怎么办？其实同样简单：
<body style="overflow-y:hidden">
<!--隐藏纵向滚动条-->
<body style="overflow-x:hidden">
<!--隐藏横向滚动条-->
三、改变滚动条的位置
干脆把滚动条的位置也换换吧：
将右边滚动条移至左边：
<body dir="rtl">
将底部滚动条移至顶部：
做这个效果稍微有点复杂，用到了分帧，需要三个页面，在这里假设父页面为main.htm，子页面为top.htm和bottom.htm。
main.htm文件的内容：
<html>
<frameset rows="15,*" frameborder="0">
<frame src="top.htm">
<frame src="bottom.htm">
</frameset>
</html>
top.htm文件的内容：
<html> <!--当滚动事件触发时，使一下帧页面的横向滚动距离与上一帧页面的横向滚动距离保持一致--> <body onscroll="top.frames.bottom.document.body.scrollLeft=document.body.scrollLeft"style="overflow-y:hidden"> <!-插入一个层，并使它的宽度等于下一帧页面的滚动栏宽度--> <div style="width:expression(top.frames.bottom.document.body.scrollWidth)"> </div> </body> </html> bottom.htm文件的内容：
<html>
<body scroll="no">
<!-为了能看到顶部滚动条，在主体中应写入尽可能多的字符语句-->
</body>
</html>
OK，经过这样纵向横向的变换，你的滚动条与别人的比起来，就显得有个性了许多。
四、改变滚动条的颜色
“灰头土脸”的滚动条，真想把它的颜色也改了！
其实彩色滚动条效果目前在网上可是非常流行的，它通过专门的DW插件完成，该插件的下载地址为 http://www.cpcw.com/download/soft/37/ie55_scrollbar.mxp。下载后用DW自带的Extension Manager安装之后即可在common面板中找到，设置非常简单，和Photoshop取色板类似，选择好颜色后按下“OK”完成。不过有一点得注意，需要IE版本5.5以上才能看到该效果。
Body {
Crollbar-Face-Color: #FFCC00;
Scrollbar-Highlight-Color: #FF0000;
Scrollbar-Shadow-Color: #FFFFFF;
Scrollbar-3Dlight-Color: #000000;
Scrollbar-Arrow-Color: #000000;
Scrollbar-Track-Color: #fdeac4;
Scrollbar-Darkshadow-Color: #FFFF00;
}
各条语句含义如下：
Scrollbar-Face-Color为滚动条表面颜色设定；
Scrollbar-Highlight-Color为滚动条上斜面和左斜面颜色设定；
Scrollbar-Shadow-Color为滚动条下斜面和右斜面颜色设定；
Scrollbar-3Dlight-Color为滚动条上边和左边的边沿颜色设定；
Scrollbar-Arrow-Color为滚动条两端箭头颜色设定。
Scrollbar-Track-Color为滚动条底板颜色设定；
Scrollbar-Darkshadow为滚动条下边和右边边沿颜色设定。
五、图片式滚动条
现在位置也换了，颜色也变了，该轮到改形状了：
先隐藏原来的滚动条(参考前面的第一种方法)，接着找两张示意上下方向的图片，插入到网页中，最后在图片上加上javascript特效就大功告成了：
<html> <script language="javascript"> var speed=3; </script> <body scroll="no"> <!-鼠标按下时，使页面在水平方向上以0pixel，垂直方向上以10pixel移动，并且每隔0.001秒移动一次；鼠标弹起、移上时，使页面在水平方向上以0pixel，垂直方向上以3pixel移动，并且每隔0.001秒移动一次；鼠标移开时，清除对移动的计时--> <img src="up.gif" onmousedown="speed=10"onmouseup="speed=3" onmouseover="ifrscroll=setInterval('ifr.scrollBy(0,-speed)',1)" onmouseout="clearInterval(ifrscroll)"><br><img src="down.gif" onmousedown="speed=10" onmouseup="speed=3"onmouseover="ifrscroll=setInterval('ifr.scrollBy(0,speed)',1)" onmouseout="clearInterval(ifrscroll)"> <iframe src="需要滚动的网页地址" id="ifr" scrolling="no"> </body> </html>
|
