Simple Pulsating Circle Animation with jQuery jPulse Plugin
| File Size: | 12.3 KB |
|---|---|
| Views Total: | 6764 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
jPulse is a super tiny jQuery plugin that helps you implement a customizable pulsating circle (square for old IE) animation on any html element.
Basic Usage:
1. Include the latest jQuery javascript library and jpulse.js script at the bottom of your page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="jQuery.jPulse.js"></script>
2. Create an Html element where you want to implement the animation on.
<img class="demo" src="1.png" width="150px" height="150px" border="0" alt="Twitter"/>
3. Initialize the plugin with options.
<script type="text/javascript">
$(".demo").jPulse({
color: "#993175",
size: 120,
speed: 2000,
interval: 400,
left: 0,
top: 0,
zIndex: -1
});
</script>
Change logs:
2014-02-28
- update
2014-02-28
- Added zIndex in options
This awesome jQuery plugin is developed by DavisMiculis. For more Advanced Usages, please check the demo page or visit the official website.









