一个没卵用的鼠标骚特效

之前在看一个老哥的博客看到一个比较骚的特效,就是当鼠标移动,后面跟着一条小尾巴,依次是富强、民主等等,于是自己就尝试写代码实现一下,所以我弄了个原生的js实现方法,如果使用jQuery代码更简单,想要我就写。
要看特效 www.sclifftop.com,(不要开ADsafe之类的,会打不开)使用chrome浏览效果好一点,使用手机的话只有点击的时候才会出现


先上代码



稍微解释一下:

1、首先使用的是立即执行函数,这个表示直接调用执行
2、然后添加了事件监听onmousemove,当鼠标移动时就执行
3、aIndex每次加1,取arr元素,你也可以写成随机来取,要放到监听外,不然每次都会置0,就只能取“民主”
4、首先使用document.createElement()来创建div元素,然后使用document.createTextNode()来创建新文本节点,参数是要插入的文本,然后将文本节点插入div,然后把div插入body
5、然后就是对一些样式的修改,对文本样式修改不要对sTxt来改,对div来改,还有zIndex表示堆叠顺序,越大越靠前
6、也设了一个定时器,380ms移除插入bodydiv元素,不然就会一直存在
7、如果太烦,可以将onmousemove换成onmousedown之类的事件,这样就会变成点击的时候出现,试一下
8、不要一条一条地修改DOM的样式,不要像上面那样写,上面只是写出样式
9、设置为不可点击,这样就不会妨碍点击,自己加


你可能感兴趣的:(JavaScript)