JS实现开枪特效

这几天思鹏因身体不舒服在家中休息，但是热爱技术的我没有被病痛所打倒，还在坚持学习新的技术。

开枪的这个特效其实我很早之前就想要做了，但是由于技术的原因一直没有实现，在这几天的休息中忽然灵感大发，想到了解决的方案，在这里分享给大家。

源代码:

document.onclick = function(e){
     //获取audioID
	 var audioId = document.getElementById("boom");
	 audioId.load();//重新加载音频
	 audioId.play();//播放音频
	 //动态创建div
	 var floorDiv = document.createElement('div');
	 //给创建的div赋予样式
	 floorDiv.style.width = "310px";
	 floorDiv.style.height = "280px";
	 floorDiv.style.background = "red";
	 floorDiv.style.borderRadius = "310px";
	 floorDiv.style.background = "url(1.png)";
	 //将创建好的DIV添加进body中
	 document.body.appendChild(floorDiv);
	 //获取鼠标当前坐标位
	 var x = e.clientX;
	 var y = e.clientY;
	 floorDiv.style.position = "absolute";
	 //将当前坐标位的值当做参数赋予元素的定位值
	 floorDiv.style.left = x-145 + "px";
         floorDiv.style.top = y-140 + "px";
	}

在线演示：

http://sipeng.net/yanshi/index.html

源码下载：

开枪特效下载