jq获取随机颜色和改变样式

2024-07-13 13:28| 来源: 网络整理| 查看: 265

abstract：这节课最主要的一点就是原生js随机颜色的获取方法:var bgcolor = "rgb(" + Math.floor(Math.random() * 256) + "," + Math.floor(Math.random() *

这节课最主要的一点就是原生js随机颜色的获取方法:

var bgcolor = "rgb(" + Math.floor(Math.random() * 256) + "," + Math.floor(Math.random() * 256) + "," + Math.floor(Math.random() * 256) + ")";

然后通过for循环设置所有元素的随机背景色

最后用jq事件改变元素的样式,中间也用到了前面学的圆角和阴影效果.

实例练习:

搜狗截图20181218172428.png

搜狗截图20181218172455.png

搜狗截图20181218172522.png

代码: Document * { margin: 0; padding: 0; } .box { width: 614px; height: 300px; border: 0px solid green; margin: 30px auto; } span { transition: 0.3s; display: inline-block; width: 200px; height: 200px; background: green; } button { font-size: 20px; display: block; width: 100px; height: 50px; margin: 20px auto; box-shadow: 8px 8px 15px grey; } button:hover { box-shadow: 3px 3px 10px grey; } window.onload = function () { var i; var obtn = document.getElementById("btn"); obtn.onclick = function bg() { var len = document.getElementsByTagName("span"); for (i = 0; i

【本文地址】

jq获取随机颜色和改变样式

jq获取随机颜色和改变样式

今日新闻

推荐新闻