链接类

VML

按钮类

标题类

表单类

表格类

菜单类

窗口类

对象类

滚动条

键盘类

框架类

例子类

模拟类

日期类

色彩类

鼠标类

数学类

图片类

文字类

下拉框

样式类

游戏类

状态栏

资料类

字幕类

其它类

 ·拖动滚动条
 ·Cookie记住滚动...
 ·控制表格内的滚动条
 ·跟着滚动条的层
 ·局部滚动
 ·拖动页面
 ·双击滚屏
您当前位置:好素材首页 -> 网页特效 -> 滚动条
查看信息

滚动条颜色生成器
好素材网 www.HaoSc.com 02月22日 11:49

[查看演示]  源码如下
----------------------------------------------------------
<HTML>
<HEAD>
<TITLE>滚动条颜色生成器IE5.5+-www.51windows.Net</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<STYLE type=text/css>
BODY {
MARGIN: 25px
}
td,div,p {FONT-SIZE: 12px; LINE-HEIGHT: 140%;}
</STYLE>
<SCRIPT language=JavaScript>
<!--

function MM_goToURL() { //v3.0
var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
function JM_cc(ob){
var obj=MM_findObj(ob); if (obj) {
obj.select();js=obj.createTextRange();js.execCommand("Copy");}
}

function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
//-->
</SCRIPT>
<META content="MSHTML 5.00.2920.0" name=GENERATOR>
<SCRIPT language=JavaScript>
function UpdateScroll(el) { //reCreated By 51JS.COM -Jimmy & Tantom
var sB='<STYLE>\nBODY {\n';sE='\n}\n</STYLE>';sR=/;/g
if (document.body) {
document.body.style[el.name] = el.value
var obj=MM_findObj('js_1'); if (obj) {
nCssText=document.body.style.cssText.replace(sR,";\n");
obj.value=sB+nCssText+sE}
}

}
function setColorPanel(colorStep){ //Created By Jimmy
var colorPanelHTML="";colorCount=Math.round(255/colorStep);
for (k=colorStep;k>=0;k--){
for (j=0;j<=colorStep;j++){
for (i=0;i<=colorStep;i++){
colorPanelHTML+='<font size=3 color=RGB('+k*colorCount+','+i*colorCount+','+j*colorCount+')>■</font>';
}
}
}
//alert(colorPanelHTML);
return colorPanelHTML;
}

function makeColorPanel(){
var cValueObj=MM_findObj('colorStepValue');
if(cValueObj){colorPanel.innerHTML=setColorPanel(cValueObj.value)}

}

function makeRandomPanel(colorPa){
var colorPanelHTML="";
var cObj=MM_findObj('colorPa');
colorPa=cObj.value;
//alert(cValueObj.value);
for (i=0;i<=517;i++){
colorPanelHTML+='<font size=3 color=RGB('+Math.round(Math.random()*colorPa)+','+Math.round(Math.random()*colorPa)+','+Math.round(Math.random()*colorPa)+')>■</font>';
}
//alert(colorPanelHTML);
colorPanel.innerHTML=colorPanelHTML
}

function showHideSet(ob){
ob.style.display=(ob.style.display)?'':'none';
}

function high(ob){
ob.className=(ob.className=='target')?'target':'high';
}
function low(ob){
ob.className=(ob.className=='target')?'target':'';
}
function setTarget(tob){
for (i=1;i<9;i++){
eval('e'+i).className='';
}

event.srcElement.className='target'
obcurrentSet=MM_findObj('currentSet')
obcurrentSet.value=tob
//alert(obcurrentSet.value);

}
function setScroll(el) { //reCreated By 51JS.COM -Jimmy & Tantom
var sB='<STYLE>\nBODY {\n';sE='\n}\n</STYLE>';sR=/;/g
if (document.body) {
document.body.style[el.value] = el.value
var obj=MM_findObj('js_1'); if (obj) {
nCssText=document.body.style.cssText.replace(sR,";\n");
obj.value=sB+nCssText+sE}
}

}
function choiceColor(){
obt=MM_findObj('currentSet')
ob=MM_findObj(obt.value)
ob.value=event.srcElement.color
if (document.body) {
document.body.style[obt.value] = ob.value
var sB='<STYLE>\nBODY {\n';sE='\n}\n</STYLE>';sR=/;/g
var obj=MM_findObj('js_1'); if (obj) {
nCssText=document.body.style.cssText.replace(sR,";\n");
obj.value=sB+nCssText+sE}
}
}
function hi(){
event.srcElement.className='hi';
}
function lo(){
event.srcElement.className='';
}
</SCRIPT>
</HEAD>
<BODY bgColor=#336699 id=all text=#000000>
<TABLE border=0 cellPadding=0 cellSpacing=0 width="100%">
<TBODY>
<TR bgColor=#ffffff>
<TD width="100%"> <TABLE border=0 cellPadding=8 width="100%">
<TBODY>
<TR>
<TD align=middle>&nbsp; </TD>
</TR>
<TR>
<TD bgColor=#f7f7f7><FONT color=#990000>提示:</FONT>请注意你正使用的浏览是否<FONT
color=#990000><B>IE5.5 </B></FONT>:随着IE6与wishter的出现,这种效果将被大量使用。 <BR>
<FONT color=#990000>注意:</FONT>此生成器经站长改良加入调色板的攻能,使用更方便,效果更清析。 复制使用时请注明出处
<FONT color=#990000>无忧脚本 www.51js.com</FONT><BR>
使用:<BR>
1、 先选择一种属性然后点击该属性,你会看见属性被选择了.<BR>
2、 现在你可以在颜色输入内输入颜色代码[如Red,#ff000]或者在调色板中选择一种色彩,<FONT
color=#990000>此时请留意滚动条颜色的变化</FONT>! <BR>
3、 将代码显示框内的代码复制到页面内.ok.
<TABLE id=props style="TABLE-LAYOUT: fixed">
<COLGROUP>
<COL width=60>
<COL width=250>
<TBODY>
<TR bgColor=lightgrey>
<TH width=200><INPUT name=currentSet type=hidden value=scrollbar3dLightColor>
颜色</TH>
<TH>属性</TH>
<TH noWrap><INPUT name=colorStepValue size=3 style="DISPLAY: none" value=7> <INPUT name=colorPa size=3 value=255> <INPUT name=Button onclick=makeRandomPanel() type=button value=随机色彩>
<INPUT name=Submit2 onclick=makeColorPanel() type=button value=原色板>
<INPUT name=Button2 onclick=showHideSet(colorPanel) type=button value=显示或者隐藏调色板>
</TH>
</TR>
<TR>
<TD><INPUT name=scrollbar3dLightColor onchange=UpdateScroll(this)> </TD>
<TD class=target id=e1 onclick="setTarget('scrollbar3dLightColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-3dLight-Color</TD>
<TD rowSpan=8> <TABLE align=center border=0 cellPadding=0 cellSpacing=0
width="100%">
<TBODY>
<TR>
<TD id=colorPanel onclick=choiceColor() onmouseout=lo() onmouseover=hi()> <SCRIPT language=JavaScript>document.write(setColorPanel(7));</SCRIPT> </TD>
</TR>
</TBODY>
</TABLE></TD>
</TR>
<TR>
<TD><INPUT name=scrollbarArrowColor onchange=UpdateScroll(this)> </TD>
<TD id=e2 onclick="setTarget('scrollbarArrowColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-Arrow-Color</TD>
</TR>
<TR>
<TD><INPUT name=scrollbarBaseColor onchange=UpdateScroll(this)> </TD>
<TD id=e3 onclick="setTarget('scrollbarBaseColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-Base-Color</TD>
</TR>
<TR>
<TD><INPUT name=scrollbarDarkShadowColor onchange=UpdateScroll(this)> </TD>
<TD id=e4 onclick="setTarget('scrollbarDarkShadowColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-DarkShadow-Color</TD>
</TR>
<TR>
<TD><INPUT name=scrollbarFaceColor onchange=UpdateScroll(this)> </TD>
<TD id=e5 onclick="setTarget('scrollbarFaceColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-Face-Color</TD>
</TR>
<TR>
<TD><INPUT name=scrollbarHighlightColor onchange=UpdateScroll(this)> </TD>
<TD id=e6 onclick="setTarget('scrollbarHighlightColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-Highlight-Color</TD>
</TR>
<TR>
<TD><INPUT name=scrollbarShadowColor onchange=UpdateScroll(this)> </TD>
<TD id=e7 onclick="setTarget('scrollbarShadowColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-Shadow-Color</TD>
</TR>
<TR>
<TD><INPUT name=scrollbarTrackColor onchange=UpdateScroll(this)> </TD>
<TD id=e8 onclick="setTarget('scrollbarTrackColor')" onmouseout=low(this) onmouseover=high(this)>scrollbar-Track-Color</TD>
</TR>
</TBODY>
</TABLE></TD>
</TR>
<TR>
<TD>1.将下面的代码复制到&lt;head&gt; 内<INPUT name=Button onclick="JM_cc('js_1')" type=button value=复制到我的剪贴板>
<BR> <FORM action="" method=post name=form1>
<TEXTAREA cols=80 name=js_1 rows=10 wrap=VIRTUAL></TEXTAREA>
</FORM></TD>
</TR>
</TBODY>
</TABLE></TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>

<div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">
<input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div>


此信息共 1 页 [1]