表白神器

最新推荐文章于 2019-09-04 23:59:37 发布

aoqvnsl555481

最新推荐文章于 2019-09-04 23:59:37 发布

阅读量153

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/TMDD/p/6092191.html

版权

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">

/*第二步：创建img标签将这个img标签对象追加到body标签里面
给这个标签对象添加src属性
这一张图片的大小要随机出现
位置也要随机出来 Math.random()
innerWidth与innerHeight来控制
当点击当前图片时要将当前的图片删除 removeChild() this
*/
//第一步：当页面加载完成后开始执行定时器
window.onload = function(){
setInterval("createImg()",100);
document.body.bgColor="#000";
}
//定义图片的大小的变量
var img_min_width =50;
var img_max_width = 100;
var x = 0;
var y = innerWidth-img_max_width;//窗口文档的边框
var t = 0;
var b = innerHeight-img_max_width;//窗口文档的高度

function createImg(){
//每隔一定时间就执行下面的一个随机值
var wid = getRandom(img_max_width,img_min_width);
//每隔一定时间就获取水平位置位置的变量值；
var left = getRandom(y,x);
//每隔一定时间就随机获取垂直位置的变量
var top = getRandom(b,t);
//创建一个标签img createElement创建标签的意思
var img_node = document.createElement("img");
//把变量值给BODY在输出； appendChild是传输的意思；
document.body.appendChild(img_node);
//给这个标签添加src对象
img_node.setAttribute("src","../漫天小星星图片images/13.jpg");
//每一个图片都应随机出来
img_node.setAttribute("width",wid);
//位置也随机出来
img_node.setAttribute("style","position:absolute;left:"+left+"px;top:"+top+"px;");
当点击当前图片时要将当前的图片删除要给图片添加一个onclick
img_node.setAttribute("onclick","removeImg()tihe");
}
function getRandom(max,min){
return Math.floor(Math.random()*(max-min+1)+min);

}
function removeImg(obj){
obj.parentNode.removeChild(obj);
}

转载于:https://www.cnblogs.com/TMDD/p/6092191.html

aoqvnsl555481

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
表白神器

<!DOCTYPE html><html><head> <title></title> <meta charset="utf-8"></head><body> <script type="text/javascript"> /*第二步：创建img标签将这个img标签对象追...
复制链接

扫一扫