jQuery Plugin For Magic Cursor Animations - jStars

jStars is a lightweight jQuery plugin for creating fancy visual effects (e.g. sparkling stars) that interacts with your mouse move and touch events. Heavily based on the CSS image sprite technology.

How to use it:

1. Just put jQuery library and the jQuery jStars plugin at the bottom of the webpage and we're ready to go.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="js/jquery-stars.js"></script>

2. Call the function on the target container and specify the folder path where you place the sprite images.

$('.demo1').jstars({
  image_path: 'images'  
});

3. By default, the plugin will use the 'jstar-map.png' for creating white sparkling stars that follow your cursor. You can change the default color in the javascript as this:

$('.demo1').jstars({

  image_path: 'images',

  // white, red, green, yellow
  // blue and rand
  style: 'rand' 
  
});

4. Change the default image source.

$('.demo1').jstars({

  image_path: 'images',
  image: 'YOUR IMAGE.png'

});

5. More customization options.

$('.demo1').jstars({

  frequency: 12,
  style_map: {
    white: 0,
    blue: -27,
    green: -54,
    red: -81,
    yellow: -108
  },
  width: 27,
  height: 27,
  delay: 300

});

Change log:

2018-02-16

• Tweaks.

2018-02-15

• Add touch device support

2016-08-12

• JS update

2016-05-07

• Added a new modern stars with rotate

---

This awesome jQuery plugin is developed by justcoded. For more Advanced Usages, please check the demo page or visit the official website.