|
@@ -14,50 +14,11 @@
|
|
|
</head>
|
|
</head>
|
|
|
|
|
|
|
|
<body>
|
|
<body>
|
|
|
- <img src="img/1.png" alt="">
|
|
|
|
|
|
|
+ <!-- <img src="img/1.png" alt=""> -->
|
|
|
<script>
|
|
<script>
|
|
|
//获取屏幕的宽高
|
|
//获取屏幕的宽高
|
|
|
var screenWidth = document.body.clientWidth || document.documentElement.clientWidth;
|
|
var screenWidth = document.body.clientWidth || document.documentElement.clientWidth;
|
|
|
var screenHeight = document.body.clientHeight || document.documentElement.clientHeight;
|
|
var screenHeight = document.body.clientHeight || document.documentElement.clientHeight;
|
|
|
- //构造函数 写属性
|
|
|
|
|
- function leaf() {
|
|
|
|
|
- //图片宽度
|
|
|
|
|
- this.width = Math.random() * 100 + 100;
|
|
|
|
|
- //图片距离左边的距离
|
|
|
|
|
- this.xLeft = Math.random() * (screenWidth - this.width)
|
|
|
|
|
- //距离顶部
|
|
|
|
|
- this.xTop = 0
|
|
|
|
|
- //图片路径
|
|
|
|
|
- this.bg = 'img/' + Math.floor(Math.random() * 4 + 1) + '.png'
|
|
|
|
|
- /*
|
|
|
|
|
- 如何让随机数为1，2，3，4整数
|
|
|
|
|
- Math.random() 0-1随机小数
|
|
|
|
|
- Math.random() * 4 0-4随机小数
|
|
|
|
|
- Math.random() * 4 + 1 1-5之间的随机小数 不包括5
|
|
|
|
|
-
|
|
|
|
|
- Math.floor() 向下取整 跟四舍五入没关系
|
|
|
|
|
- Math.floor(Math.random() * 4 + 1) 1，2，3，4
|
|
|
|
|
- */
|
|
|
|
|
- }
|
|
|
|
|
- // 原型下面写方法
|
|
|
|
|
- leaf.prototype.init = function(){
|
|
|
|
|
- //创建img标签
|
|
|
|
|
- var oImg = document.createElement('img')
|
|
|
|
|
- //引用路径
|
|
|
|
|
- oImg.src = this.bg
|
|
|
|
|
- oImg.style.width = this.width + 'px'
|
|
|
|
|
- oImg.style.left = this.xLeft + 'px'
|
|
|
|
|
- oImg.style.top = this.xTop + 'px'
|
|
|
|
|
- this.img = oImg
|
|
|
|
|
- document.body.appendChild(oImg)
|
|
|
|
|
- }
|
|
|
|
|
- var leafArr = []
|
|
|
|
|
- for (var i = 0; i < 20; i++) {
|
|
|
|
|
- //创建实例化对象
|
|
|
|
|
- var leaf1 = new leaf()
|
|
|
|
|
- leafArr.push(leaf1)
|
|
|
|
|
- leaf1.init()
|
|
|
|
|
- }
|
|
|
|
|
</script>
|
|
</script>
|
|
|
</body>
|
|
</body>
|
|
|
|
|
|
zsydgithub