sparkleHover.js是鼠标滑过HTML元素产生爆炸特效的jquery插件。通过该jquery插件，你可以在鼠标经过指定的HTML元素时，使用指定的图片来制作炫酷的爆炸效果。

使用方法

在页面中引入jquery和sparkleHover.js文件。

<script src="path/to/jquery.min.js" type="text/javascript"></script>
<script src="path/to/sparkleHover.js"></script>
初始化插件

在页面DOM元素加载完毕之后，通过下面的方法来初始化该jquery插件。

$('element-id-or-class-goes-here').sparkleHover();

或者在初始化时设置一些配置参数：

$('#c').sparkleHover({
  colors : ['#297E97', "#2EB8D5",'#36BEC1'],
  num_sprites: 22,
  lifespan: 3000,
  radius: 500,
  sprite_size: 40,
  shape: 'circle',
  image: 'Pumplin.jpg'
});
配置参数

该jquery插件的可用配置参数有：

  • colors：一种颜色或颜色数组。
  • radius：爆炸的半径，整数值。
  • sprite_size：图片的尺寸，整数值。
  • shape：图片的形状，可选值有：'circle, 'triangle' 或 'square'
  • lifespan：整数，单位毫秒。
  • num_sprites：爆炸碎片的数量。
  • image：爆炸的图片，可以是图片的url，或者是某种背景颜色值rgba(0,0,0,0)。
  • gravity：true或false。

sparkleHover.js插件的github地址为：https://github.com/evejweinberg/sparkleHover