js实现交通灯效果

前端之家收集整理的这篇文章主要介绍了js实现交通灯效果前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

主体结构

  • 样式

    li{ display:block; } #traffic span{ display:inline-block; width:50px; height:50px; background-color:gray; margin:5px; border-radius:50%; float:left; } #traffic.stop li:nth-child(1) span{ background-color:yellow; } #traffic.wait li:nth-child(2) span{ background-color:red; } #traffic.pass li:nth-child(3) span{ background-color:green; }

    js代码

    利用定时器改变类名

    以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程之家!

    猜你在找的JavaScript相关文章