js实现彩色条纹滚动条效果

左侧可用调色板选择条纹颜色

效果图：

代码如下：

！doctype html html heartheta charset=' utf-8 ' title/title style * { margin :0；划水：0;} @-网络工具包-关键帧演示{来自{ left:0}转到{左侧：-113 px；}}.盒子{宽度：120像素高度：400 pxborder:1px固体# 000;margin:100px汽车位置：相对；飞越：隐藏；}.bar { position : absolute eleft :0 top :0宽度宽度：500像素高度：400 px背景：-网络套件-重复-线性-梯度(-45度，红色0px，红色20px，#fff 20px，#fff 40px，蓝色40px，蓝色60px，#fff 60px，# fff 80px)；动画：移动2s线性无限；}/style脚本窗口。onload=function(){ var OC1=document。query selectorall(' input ')[0]；var OC2=文档。query selectorall(' input ')[1]；var oBar=document.querySelector(' .盒子bar’)；oc1。onchange=oc2。onchange=function(){ obar。风格。背景='-网络工具包-重复-线性-梯度(-45度，' oC1.value ' 0px，' oC1.value ' 20px，#fff 20px，#fff 40px，' oC2.value ' 40px，' oC2.value ' 60px，#fff 60px，# fff 80px ')；};};/脚本/流浆池输入类型='color '值='#ff0000' /输入类型=' color ' value=' # 0000 ff '/div class=' box ' div class=' bar '/div/div/body/html以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持我们！