修改jquery插件carouFredSel使其支持鼠标移过切换
今天在做焦点图的时候，误选了carouFredSel，jquery的插件，发现其给到的切换效果都是要点击才能实现切换，后只能自己动手修改代码来解决，我的解决思路是将其click的方法同样复制一份改为hover触发，同时为了避免hover过于灵敏出现的鼠标不能略过的问题，加入hover延时处理，以下是修改后的完整代码，红色部分，为我的修改部分，希望对大家有所帮助。
/*!
* jQuery.mouseDelay.js v1.2
* Copyright 2011, TangBin
* Dual licensed under the MIT or GPL Version 2 licenses.
*/
(function ($, plugin) {
var data = {}, id = 1, etid = plugin + 'ETID';
// 延时构造器
$.fn[plugin] = function (speed, group) {
id ++;
group = group || this.data(etid) || id;
speed = speed || 150;
// 缓存分组名称到元素
if (group === id) this.data(etid, group);
// 暂存官方的hover方法
this._hover = this.hover;
// 伪装一个hover函数，并截获两个回调函数交给真正的hover函数处理
this.hover = function (over, out) {
over = over || $.noop;
out = out || $.noop;
this._hover(function (event) {
var elem = this;
clearTimeout(data[group]);
data[group] = setTimeout(function () {
over.call(elem, event);
}
, speed);
}
, function (event) {
var elem = this;
clearTimeout(data[group]);
data[group] = setTimeout(function () {
out.call(elem, event);
}
, speed);
});
return this;
};
return this;
};
// 冻结选定元素的延时器
$.fn[plugin + 'Pause'] = function () {
clearTimeout(this.data(etid));
return this;
};
// 静态方法
$[plugin] = {
// 获取一个唯一分组名称
get: function () {
return id ++;
}
,
// 冻结指定分组的延时器
pause: function (group) {
clearTimeout(data[group]);
}
};
})(jQuery, 'mouseDelay');
(function(a){
a.fn.carouFredSel=function(b){
return this.each(function(){
var c=a.extend(true,{},a.fn.carouFredSel.defaults,b),f=a(this),h=a("> *",f),m=h.length,i=h.outerWidth(true),d=h.outerHeight(true),j=0,l=null,k=(c.direction=="up"||c.direction=="left")?"next":"prev";
if(c.scroll.items==null){
c.scroll.items=c.visibleItems
}
c.auto=a.fn.carouFredSel.getNaviObject(c.auto,false,true);
c.prev=a.fn.carouFredSel.getNaviObject(c.prev);
c.next=a.fn.carouFredSel.getNaviObject(c.next);
c.pagination=a.fn.carouFredSel.getNaviObject(c.pagination,true);
c.auto=a.extend({},c.scroll,c.auto);
c.prev=a.extend({},c.scroll,c.prev);
c.next=a.extend({},c.scroll,c.next);
c.pagination=a.extend({},c.scroll,c.pagination);
if(typeof(c.pagination.anchorBuilder)!="function"){
c.pagination.anchorBuilder=a.fn.carouFredSel.pageAnchorBuilder
}
if(typeof(c.pagination.keys)!="boolean"){
c.pagination.keys=false
}
if(typeof(c.auto.play)!="boolean"){
c.auto.play=true
}
if(typeof(c.auto.nap)!="boolean"){
c.auto.nap=true
}
if(typeof(c.auto.delay)!="number"){
c.auto.delay=0
}
if(typeof(c.auto.pauseDuration)!="number"){
c.auto.pauseDuration=c.auto.duration*6
}
if(c.auto.pauseDuration==c.auto.duration){
c.auto.duration--
}
c.prev.name="prev";
c.next.name="next";
c.pagination.name="pagination";
if(c.visibleItems>=m){
a.fn.carouFredSel.log("Not enough items: terminating");
if(c.prev.button){
c.prev.button.hide()
}
if(c.next.button){
c.next.button.hide()
}
if(c.pagination.container){
c.pagination.container.hide()
}
return
}
if(c.direction=="right"||c.direction=="left"){
var g=["width",i*2];
var e={
width:c.width||i*c.visibleItems,height:c.height||d
}
}
else{
var g=["height",d*2];
var e={
height:c.height||d*c.visibleItems,width:c.width||i
}
}
f.css(g[0],g[1]*m).css({
position:"absolute"
}).wrap('<div class="caroufredsel_wrapper" />').parent().css(e).css({
position:"relative",overflow:"hidden"
});
f.bind("pause",function(){
if(l!=null){
clearTimeout(l)
}
}).bind("play",function(o,p,n){
if(c.auto.play){
if(typeof(p)=="undefined"){
p=k
}
if(typeof(n)=="undefined"){
n=0
}
l=setTimeout(function(){
if(f.is(":animated")){
f.trigger("pause").trigger("play",p)
}
else{
f.trigger(p,c.auto)
}
}
,c.auto.pauseDuration+n)
}
}).bind("prev",function(r,v,s){
if(f.is(":animated")){
return
}
if(c.visibleItems>=m){
return
}
if(typeof(v)=="number"){
s=v
}
if(typeof(v)!="object"){
v=c.prev
}
if(typeof(s)!="number"){
s=v.items
}
if(!s||typeof(s)!="number"){
a.fn.carouFredSel.log("Not a valid number.");
return
}
f.find("> *:gt("+(m-s-1)+")").prependTo(f);
if(m<c.visibleItems+s){
f.find("> *:lt("+((c.visibleItems+s)-m)+")").clone(true).appendTo(f)
}
j-=s;
if(j<0){
j+=m
}
var t=a.fn.carouFredSel.getCurrentItems(f,c,s);
if(c.direction=="right"||c.direction=="left"){
var u="left",o=i
}
else{
var u="top",o=d
}
var q={},p={},n=(v.duration=="auto")?c.scroll.duration/c.scroll.items*s:v.duration;
q[u]=-(o*s);
p[u]=0;
if(v.onBefore){
v.onBefore(t[1],t[0],v.name)
}
f.data("numItems",s).data("sliderObj",v).data("oldItems",t[1]).data("newItems",t[0]).css(q).animate(p,{
duration:n,easing:v.easing,complete:function(){
if(m<c.visibleItems+f.data("numItems")){
f.find("> *:gt("+(m-1)+")").remove()
}
if(f.data("sliderObj").onAfter){
f.data("sliderObj").onAfter(f.data("oldItems"),f.data("newItems"),f.data("sliderObj").name)
}
}
});
f.trigger("updatePageStatus").trigger("pause").trigger("play","prev")
}).bind("next",function(r,v,s){
if(f.is(":animated")){
return
}
if(c.visibleItems>=m){
return
}
if(typeof(v)=="number"){
s=v
}
if(typeof(v)!="object"){
v=c.next
}
if(typeof(s)!="number"){
s=v.items
}
if(!s||typeof(s)!="number"){
a.fn.carouFredSel.log("Not a valid number.");
return
}
if(m<c.visibleItems+s){
f.find("> *:lt("+((c.visibleItems+s)-m)+")").clone(true).appendTo(f)
}
j+=s;
if(j>=m){
j-=m
}
var t=a.fn.carouFredSel.getCurrentItems(f,c,s);
if(c.direction=="right"||c.direction=="left"){
var u="left",p=i
}
else{
var u="top",p=d
}
var q={},o={},n=(v.duration=="auto")?c.scroll.duration/c.scroll.items*s:v.duration;
q[u]=-(p*s);
o[u]=0;
if(v.onBefore){
v.onBefore(t[0],t[1],v.name)
}
f.data("numItems",s).data("sliderObj",v).data("oldItems",t[0]).data("newItems",t[1]).animate(q,{
duration:n,easing:v.easing,complete:function(){
if(f.data("sliderObj").onAfter){
f.data("sliderObj").onAfter(f.data("oldItems"),f.data("newItems"),f.data("sliderObj").name)
}
if(m<c.visibleItems+f.data("numItems")){
f.find("> *:gt("+(m-1)+")").remove()
}
f.css(o).find("> *:lt("+f.data("numItems")+")").appendTo(f)
}
});
f.trigger("updatePageStatus").trigger("pause").trigger("play","next")
}).bind("scrollTo",function(p,s,r,q){
if(f.is(":animated")){
return
}
if(typeof(s)=="string"){
s=parseInt(s)
}
if(typeof(s)=="object"){
s=f.find("> *").index(s)
}
else{
if(typeof(s)=="number"){
s+=-j+m;
if(s>=m){
s-=m
}
}
}
if(typeof(s)!="number"||s==-1){
a.fn.carouFredSel.log("Not a valid number.");
return
}
if(typeof(r)=="string"){
r=parseInt(r)
}
if(typeof(r)!="number"){
r=0
}
if(typeof(q)!="object"){
q=false
}
s+=r;
if(s<0){
s+=m
}
if(s>=m){
s-=m
}
if(s==0){
return
}
if(s<m/2){
f.trigger("next",[q,s])
}
else{
f.trigger("prev",[q,m-s])
}
}).bind("slideTo",function(p,s,r,q){
f.trigger("scrollTo",[s,r,q])
}).bind("insertItem",function(r,q,s){
if(typeof(q)=="string"){
q=a(q)
}
if(typeof(q)!="object"||typeof(q.jquery)=="undefined"||q.length==0){
a.fn.carouFredSel.log("Not a valid object.");
return
}
if(typeof(s)=="undefined"){
s="after"
}
if(typeof(s)=="number"){
s=s-1
}
if(typeof(s)=="string"){
if(s=="before"){
s=m-1
}
else{
if(s=="after"){
s=c.visibleItems-1
}
else{
if(s=="end"){
s=m-j-1
}
else{
s=a(s)
}
}
}
}
if(typeof(s)=="object"){
s=f.find("> *").index(s)-1
}
if(typeof(s)!="number"){
a.fn.carouFredSel.log("Not a valid number.");
return
}
var p=m-j;
if(p>=m){
p-=m
}
if(s>=p&&p>0){
j+=q.length
}
var o=f.find("> *");
if(o.length<2){
if(s==-1){
f.prepend(q)
}
else{
f.append(q)
}
}
else{
if(s==-1){
o.filter(":nth(0)").before(q)
}
else{
o.filter(":nth("+s+")").after(q)
}
}
h=f.find("> *");
m=h.length;
f.css(g[0],g[1]*m).trigger("updatePageStatus",true)
}).bind("removeItem",function(q,p){
if(typeof(p)=="object"&&typeof(p.jquery)=="undefined"){
p=a(p)
}
if(typeof(p)=="string"){
p=a(p)
}
if(typeof(p)=="number"){
p=f.find("> *:nth("+p+")")
}
if(typeof(p)!="object"||typeof(p.jquery)=="undefined"||p.length==0){
a.fn.carouFredSel.log("Not a valid object.");
return
}
var r=f.find("> *").index(p);
var o=m-j;
if(o>=m){
o-=m
}
if(r>=o&&o>0){
j-=p.length
}
else{
if(o-p.length==0){
j=0
}
}
p.remove();
h=f.find("> *");
m=h.length;
f.css(g[0],g[1]*m).trigger("updatePageStatus",true)
}).bind("updatePageStatus",function(p,q){
if(c.pagination.container==null||c.pagination.container.length==0){
return false
}
if(typeof(q)=="boolean"&&q){
c.pagination.container.find("> *").remove();
for(var n=0;n<Math.ceil(m/c.visibleItems);
n++){
c.pagination.container.append(c.pagination.anchorBuilder(n+1))
}
c.pagination.container.find("> *").each(function(r){
a(this).unbind("click").mouseDelay(150).hover(function(){
f.trigger("scrollTo",[r*c.visibleItems,0,c.pagination]);
return false
})
})
c.pagination.container.find("> *").each(function(r){
a(this).unbind("click").click(function(){
f.trigger("scrollTo",[r*c.visibleItems,0,c.pagination]);
return false
})
})
}
var o=Math.round(j/c.visibleItems);
c.pagination.container.find("> *").removeClass("selected").filter(":nth("+o+")").addClass("selected")
});
if(c.auto.pauseOnHover&&c.auto.play){
f.hover(function(){
f.trigger("pause")
}
,function(){
f.trigger("play",k)
})
}
if(c.prev.button!=null&&c.prev.button.length){
c.prev.button.click(function(){
f.trigger("prev");
return false
});
if(c.prev.pauseOnHover&&c.auto.play){
c.prev.button.hover(function(){
f.trigger("pause")
}
,function(){
f.trigger("play",k)
})
}
}
if(c.next.button!=null&&c.next.button.length){
c.next.button.click(function(){
f.trigger("next");
return false
});
if(c.next.pauseOnHover&&c.auto.play){
c.next.button.hover(function(){
f.trigger("pause")
}
,function(){
f.trigger("play",k)
})
}
}
if(c.pagination.container!=null&&c.pagination.container.length){
f.trigger("updatePageStatus",true);
if(c.pagination.pauseOnHover&&c.auto.play){
c.pagination.container.hover(function(){
f.trigger("pause")
}
,function(){
f.trigger("play",k)
})
}
}
if(c.next.key||c.prev.key){
a(document).keyup(function(o){
var n=o.keyCode;
if(n==c.next.key){
f.trigger("next")
}
if(n==c.prev.key){
f.trigger("prev")
}
})
}
if(c.pagination.keys){
a(document).keyup(function(o){
var n=o.keyCode;
if(n>=49&&n<58){
n=(n-49)*c.visibleItems;
if(n<=m){
f.trigger("scrollTo",[n,0,c.pagination])
}
}
})
}
if(c.auto.play){
f.trigger("play",[k,c.auto.delay]);
if(a.fn.nap&&c.auto.nap){
f.nap("pause","play")
}
}
})
};
a.fn.carouFredSel.defaults={
height:null,width:null,visibleItems:5,direction:"left",scroll:{
items:null,easing:"swing",duration:500,pauseOnHover:false,onBefore:null,onAfter:null
}
};
a.fn.carouFredSel.getKeyCode=function(b){
if(b=="right"){
return 39
}
if(b=="left"){
return 37
}
if(b=="up"){
return 38
}
if(b=="down"){
return 40
}
return -1
};
a.fn.carouFredSel.getNaviObject=function(d,c,e){
if(typeof(c)!="boolean"){
c=false
}
if(typeof(e)!="boolean"){
e=false
}
if(typeof(d)=="undefined"){
d={}
}
if(typeof(d)=="string"){
var b=a.fn.carouFredSel.getKeyCode(d);
if(b==-1){
d=a(d)
}
else{
d=b
}
}
if(c){
if(typeof(d.jquery)!="undefined"){
d={
container:d
}
}
if(typeof(d)=="boolean"){
d={
keys:d
}
}
if(typeof(d.container)=="string"){
d.container=a(d.container)
}
}
else{
if(e){
if(typeof(d)=="boolean"){
d={
play:d
}
}
if(typeof(d)=="number"){
d={
pauseDuration:d
}
}
}
else{
if(typeof(d.jquery)!="undefined"){
d={
button:d
}
}
if(typeof(d)=="number"){
d={
key:d
}
}
if(typeof(d.button)=="string"){
d.button=a(d.button)
}
if(typeof(d.key)=="string"){
d.key=a.fn.carouFredSel.getKeyCode(d.key)
}
}
}
return d
};
a.fn.carouFredSel.getCurrentItems=function(e,d,f){
var c=e.find("> *:lt("+d.visibleItems+")"),b=e.find("> *:lt("+(d.visibleItems+f)+"):gt("+(f-1)+")");
return[c,b]
};
a.fn.carouFredSel.log=function(c){
try{
console.log("carouFredSel: "+c)
}
catch(b){}
};
a.fn.carouFredSel.pageAnchorBuilder=function(b){
return'<a href="#"><span>'+b+"</span></a>"
}
})(jQuery);
