2、document.getElementById("aaa").value.bgColor="blue"改成：
document.getElementById("aaa").bgColor="blue"
3、javascript语法要求句末要用分号结束。
4、两个radio要联动的话，要有相同name值。
这个完全是我本人自己真实项目当中的代码
http://1.xifan00520.applinzi.com/weixin/index.html
其实不用js 用css3就能完成
代码如下
标签：{
background: -webkit-gradient(linear,left top,right top,color-stop(0, #3CAF5A),color-stop(0.3, #3CAF5A),color-stop(0.5, white),color-stop(0.7, #3CAF5A),color-stop(1, #3CAF5A))
background-clip: text//文字背景区域
-webkit-background-clip: text
-webkit-text-fill-color: transparent
text-fill-color: transparent
-webkit-animation: slidetounlock 2s linear infinite//动画执行的参数 第一是 动画执行的名字 第二是所需时间 第三是执行动画的快慢infinite是均速 第四个参数是循环
animation: slidetounlock 2s linear infinite
}
为了兼容建议把写全 百分比是指动画执行到多少以后执行里面的动画
@keyframes slidetounlock{
0% {
background-position: -2rem 0
}
80% {
background-position: 1rem 0
}
100% {
background-position: 2rem 0
}
}
@-webkit-keyframes slidetounlock{
0% {
background-position: -2rem 0
}
80% {
background-position: 1rem 0
}
100% {
background-position: 2rem 0
}
}
@-moz-keyframes slidetounlock{
0% {
background-position: -1.1rem 0
}
80% {
background-position: 1rem 0
}
100% {
background-position: 1.1rem 0
}
}
@-ms-keyframes slidetounlock{
0% {
background-position: -1.1rem 0
}
80% {
background-position: 1rem 0
}
100% {
background-position: 1.1rem 0
}
}
@-o-keyframes slidetounlock{
0% {
background-position: -1.1rem 0
}
80% {
background-position: 1rem 0
}
100% {
background-position: 1.1rem 0
}
}
之后你只需要设置文字所在容器的宽度就行，用px可以代替rem；可根据自己的需求来修改
最后效果就是
白色会一直从左到右 有点像早期苹果滑动解锁的那种动画，这个可以根据实际需求来修改
