1、获取花瓣,所有调色条,以及用来显示rgb值的div盒子。
2、给花瓣循环绑定点击事件,这里需要一个匿名的自调用函数来储存i的值,不然事件绑定不上,i值会变为最终长度值。
3、利用"排他思想"循环遍历将所有花瓣的selected类名去掉,然后给当前点击的花瓣添加被选中的类名"selected"将边框变为虚线,表示被选中。
4、下面一个for循环同样利用了匿名的自调用函数存储i值,然后给所有的调色条绑定input事件。
5、判断一下是否有被选中的元素,通过判断之后获取带有selected类名的花瓣,然后将其背景颜色改为三个input输入的value值,最后将三个rgb值渲染到显示rgb值的div盒子中,这样一个彩色花瓣的效果就完成了。
1、你的那段放在<body></body>之间2、要把文章内容放在<p id="ccon"></div>中间,并接在你那段后面;
2、再就是将这段代码放到<head></head>之间
<script language="javascript">
//保存背景颜色和字号
function setSz()
{
var va = document.getElementById("bjColor").value
setCookie("bjColor", va, 30)
va = document.getElementById("wzSize").value
setCookie("wzSize", va, 30)
va = document.getElementById("wzColor").value
setCookie("wzColor", va, 30)
va = document.getElementById("gd").value
setCookie("gd", va, 30)
alert("保存成功!")
return
}
//设置背景颜色和字号
function getSz()
{
var bjColor = getCookie('bjColor')
var wzSize = getCookie('wzSize')
var wzColor = getCookie('wzColor')
var gd = getCookie('gd')
if(bjColor != null)
{
document.getElementById("ccon").style.background=bjColor
setSelect(bjColor,"bjColor")
}
if(wzSize != null)
{
document.getElementById("ccon").style.fontSize=wzSize
setSelect(wzSize,"wzSize")
}
if(wzColor != null)
{
document.getElementById("ccon").style.color=wzColor
setSelect(wzColor,"wzColor")
}
if(gd != null)
{
SetScrollValue(gd)
setSelect(gd,"gd")
}
}
/*
* 设置滚动速度
*/
var currentpos,timer
var scrollValue = 100
function SetScrollValue(value)
{
scrollValue = value * 20
}
function initialize()
{
timer = window.setInterval("scrollwindow()",scrollValue)
}
function sc()
{
clearInterval(timer)
}
function scrollwindow()
{
currentpos = document.documentElement.scrollTop
window.scroll(0,++currentpos)
window.status = currentpos
if (currentpos != document.documentElement.scrollTop) sc()
}
document.ondblclick = function()
{
initialize()
}
document.onmousedown = function()
{
sc()
}
</script>