jQuery Plugin To Set Spotlight Focus On DOM Elements - SpotLight.js

File Size: 5.06 KB
Views Total: 910
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Set Spotlight Focus On DOM Elements - SpotLight.js

SpotLight.js is a super tiny jQuery plugin for creating a spotlight overlay on your webpage to bring the user's focus to a specific element.

How to use it:

1. Add jQuery JavaScript library and the jQuery spotlight.js plugin to your webpage.

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

2. Call the plugin on your desired DOM element and done.

$(".demo").spotLightOn();

3. Possible options.

$(".demo").spotLightOn({

  // background color of the highlighted area
  color: "#ffffff",

  // background color of the overlay
  backgroundColor: "#000000",

  // opacity
  opacity: "0.4"

});

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