jQuery Plugin To Create Neon Light Effect For Text - neon

File Size: 37.9 KB
Views Total: 1450
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Create Neon Light Effect For Text - neon

neon is a lightweight jQuery plugin which adds animated neon light effects to any text using CSS3 text-shadow property.

How to use it:

1. Load the necessary jQuery library and the jQuery neon plugin in the webpage.

<link href="css/neon.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="js/jquery.neon.js"></script>

2. Load the required jQuery getRgb plugin to help return r, g, b in array from any color (rgb, hex).

<script src="js/jquery.getRgb.js"></script>

3. Create a basic text neon light effect using the data-neon="basic" attribute.

<h1 data-neon="basic">Neon Light</h1>

4. Initialize the plugin.

$(function() {$.initNeon()});

5. Default plugin settings.

state   : 'on',
color   : '#fff',
colorOff: '#444',
textShadowOff: '.02em .02em  .1em rgba(0, 0, 0, 0.8)',
rgb: $.getRgb(options.color)

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