Color Cycle is a jQuery plugin that continuously fades the background color of selected element(s). Has options for setting colors as an array as well as animation time and loop time.
1. INCLUDE JS FILES
<!-- jQuery v1.8.3 -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- jQuery UI v 1.8.23 -->
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>
<!-- jQuery Color Cycle Plugin -->
<script src="color-cycle.min.js"></script>
2. HTML
<a>1</a>
<a>2</a>
<a>3</a>
<a>4</a>
<a>5</a>
3. JAVASCRIPT
$(function()
$('a').colorCycle();
);
4. OPTIONS
$('a').colorCycle(
// colors as array on strings pass any valid CSS color value.
colors: ['red', 'rgb(0,255,0)', '#0000ff'],
// starting and end range for animation time in milliseconds.
animationStartRange: 1000,
animationEndRange: 2000,
// starting and end range for loop time in milliseconds.
loopStartRange: 1000,
loopEndRange: 4000
);
jQuery Color Cycle Plugin
No comments:
Post a Comment