日期:2014-05-16  浏览次数:20433 次

值得思考的一个问题???
突然间想用几个按钮来改变浏览器窗口滚动条的颜色,但找不到滚动条对象,而对于其他的比如textarea,div,iframe都可以直接找到对象,但整个浏览器窗口对象呢,哪里去找???下面是我改变textarea对象的JavaScript和CSS代码,有谁能改变改变整个浏览器窗口滚动条颜色,也就是动态改变???
<html>
<head>
<title> 改变滚动条颜色 </title>
<script   language= "JavaScript ">
<!--
function   changeScrollColor(color)   {
txta.style.scrollbarFaceColor   =   color;
txta.style.backgroundColor   =   color;
document.recalc();
}

//-->
</script>

<style   type= "text/css ">
<!--
*   {
scrollbar-face-color   :   tomato;
}
-->
</style>
</head>

<body>

<textarea   id= "txta "   rows= "5 "   cols= "30 ">

</textarea>
<form>
<input   type= "button "   value= "红色 "   name= "red "   onclick= "changeScrollColor( 'tomato '); ">
<input   type= "button "   value= "蓝色 "   name= "blue "   onclick= "changeScrollColor( 'aqua '); ">
<input   type= "button "   value= "绿色 "   name= "green "   onclick= "changeScrollColor( 'springgreen '); ">

</form>
</body>
</html>


------解决方案--------------------
<html>
<head>
<title> 改变滚动条颜色 </title>
<script language= "JavaScript ">
<!--
function changeScrollColor(color) {
txta.style.scrollbarFaceColor = color;
txta.style.backgroundColor = color;
document.body.style.scrollbarFaceColor = color;
document.body.style.backgroundColor = color;
}

//-->
</script>

<style type= "text/css ">
<!--
* {
scrollbar-face-color : tomato;
}
-->
</style>
</head>

<body>

<textarea id= "txta " rows= "5 " cols= "30 ">

</textarea>
<form>
<input type= "button " value= "红色 " name= "red " onclick= "changeScrollColor( 'tomato '); ">
<input type= "button " value= "蓝色 " name= "blue " onclick= "changeScrollColor( 'aqua '); ">
<input type= "button " value= "绿色 " name= "green " onclick= "changeScrollColor( 'springgreen '); ">

</form>
</body>
</html>