forked from HarlanH/code-for-dc-edu
-
Notifications
You must be signed in to change notification settings - Fork 0
/
jQueryImgRotator.js
executable file
·107 lines (93 loc) · 2.91 KB
/
jQueryImgRotator.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
/**
* jQueryImgRotator - Image Rotator plugin
* Designed and built by Chienyi Cheri Hung <http://www.cyhung.net>
* Version: 1.0
* Licensed under the MIT licenses.
* http://www.opensource.org/licenses/mit-license.php
**/
(function($){
var ImageRotator = {
init : function(o) {
var _s; //speed
var _r; //rate
var _int; //interval
var _width; //width of wrapper
var _height; //height of wrapper
var _reset; //to reset interval if hovered
return this.each(function(){
var $this = $(this);
//default settings
_reset = false;
_settings = {
speed: 3000,
rate: 1000,
width: '300px',
height: '216px'
}
//use user settings if any
var settings = $.extend( {}, settings, _settings, o );
_s = settings.speed; //speed
_r = settings.rate; //rate
_width = settings.width; //width of wrapper
_height = settings.height; //height of wrapper
//add required styles
$this.css({'width': _width, 'height': _height}); //set dimension for wrapper
$this.find('ul').css({'margin':0,'padding':0});
$this.find('ul li').css({'position':'absolute', 'list-style': 'none'});
$this.find('ul li.show ').css({'z-index':500});
//start rotate
if($this.find('ul li').length > 1) {
$this.find('ul li').css({opacity: 0.0});
$this.find('ul li:first').css({opacity: 1.0});
_int = setInterval(function() {
iRotate();
}, _s);
};
//hover pause
$this.hover(function () {
clearInterval(_int);
},
function () {
_reset = true;
iRotate();
});
function iRotate() {
var current = ($this.find('ul li.show') ? $this.find('ul li.show') : $this.find('ul li:first'));
if ( current.length == 0 ) current = $this.find('ul li:first');
var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $this.find('ul li:first') :current.next()) : $this.find('ul li:first'));
next.css({opacity: 0.0}).addClass('show')
.animate({opacity: 1.0}, _r);
current.animate({opacity: 0.0}, _r).removeClass('show');
if(_reset == true) {
_int = setInterval(function() {
iRotate();
}, _s);
_reset = false;
};
}//iRotate
}); //init
},
loadStyle : function(t, s) {
//if css is a linked file, load into <head>
if (t == "link") {
var url = s;
$('<link rel="stylesheet" type="text/css" href="'+url+'">').appendTo("head");
}
//if css is inline, write an inline block
if (t == "inline") {
var styles = s;
$("<style type='text/css'>"+s+"</style>").appendTo("head");
}
} //loadStyle
};
$.fn.imgRotator = function( method ) {
// Method calling logic
if ( ImageRotator[method] ) {
return ImageRotator[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
return ImageRotator.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist on jQuery.ImageRotator' );
}
};
})( jQuery );