JQuery Select (radio) analog plug-in V1.3.62 improved version _jquery

First of all, thank JQuery.Select.js author Zhang, jQuery.Select.js project address: http://www.zhangjingwei.com/archives/jquery-select%E5%8D%95%E9 %80%89-%e6%a8%a1%e6%8b%9f%e6%8f%92%e4%bb%b6-v1-3-6/
The project needs to use a jquery based select simulation effect, primarily to implement select onMouseOver events, without the need to click on the pass to make a choice, looking for a lot of not ideal, finally decided in jQuery.Select.js Improved on the basis of 1.3.6.

Here is the code to increase the MouseOver event: (please download the original on the author's homepage)

Copy Code code as follows:

/*
* JQuery Select Plugins v1.3.6.2
* Copyright (c) 2009 Zhangjingwei
* Dual licensed under the MIT and GPL licenses.
* DATE:2009-11-17 09:37
* revision:1.3.6.2
* www.leadwit.com-Prodigal Son modify in 2010-07-26 14:26
*/
(function ($) {
$.fn.extend ({
Sselect:function () {
Return This.each (function (i,obj) {
var Selectid = (this.name| | this.id) + ' __jqselect ' +i| | ' __jqselect ' +i;
if (Obj.style.display!= ' None ' && $ (this). Parents () [0].id.indexof (' __jqselect ') <0) {
var TabIndex = this.tabindex| | 0;
$ (this). Before ("<div class= ' dropdown ' id=" +selectid+ "tabindex=" +tabindex+ "></div>"). Prependto ($ ("#" + Selectid));
var Selectzindex = $ (this). CSS (' Z-index '), Selectindex = $ (' # ' +selectid+ ' option '). Index (' # ' +selectid+ ' option: Selected ') [0]);
$ (' # ' +selectid). Append (' <div class= "Dropselectbox" >$ (' # ' +selectid+ ' H4 '). Empty (). Append ($ (' # ' +selectid+ ' option:selected '). text ());
var selectwidth=$ (' # ' +selectid+ ' select '). width ();
if ($.browser.safari) {selectwidth = selectwidth+15}
$ (' # ' +selectid+ ' H4 '). css ({width:selectwidth});
var selectulwidth = selectwidth + parseint ($ (' # ' +selectid+ ' H4 '). CSS ("Padding-left")) + parseint ($ (' # ' +selectid+ ' H4 '). CSS ("Padding-right"));
$ (' # ' +selectid+ ' ul '). css ({width:selectulwidth+ ' px '});
$ (' # ' +selectid+ ' select '). Hide ();
$ (' # ' +selectid+ ' div '). Hover (function () {
$ (' # ' +selectid+ ' H4 '). AddClass ("over");
},function () {
$ (' # ' +selectid+ ' H4 '). Removeclass ("over");
});
var timeobj;
$ (' # ' +selectid+ ' ul '). Bind ("MouseOver", function (e) {
Cleartimeout (Timeobj);
});
var click_fun =function () {
$ (' # ' +selectid+ ' H4 '). AddClass ("current");
$ (' # ' +selectid+ ' ul '). Show ();
var Selectzindex = $ (' # ' +selectid). css (' Z-index ');
if ($.browser.msie | | $.browser.opera) {$ ('. Dropdown '). css ({' position ': ' relative ', ' z-index ': ' 0 '});
$ (' # ' +selectid). css ({' position ': ' relative ', ' z-index ': ' 999 '});
$.fn.setselectvalue (Selectid);
Selectindex = $ (' # ' +selectid+ ' li '). Index ($ ('. Selectedli ') [0]);
var windowspace = ($ (window). scrolltop () + document.documentElement.clientHeight)-$ (' # ' +selectid). Offset (). Top;
var ulspace = $ (' # ' +selectid+ ' ul '). Outerheight (True);
var Windowspace2 = $ (' # ' +selectid). Offset (). Top-$ (window). scrolltop ()-ulspace;
Windowspace < Ulspace && windowspace2 > 0?$ (' # ' +selectid+ ' ul '). css ({top:-ulspace}): $ (' # ' +selectid+ ' ul ') ). CSS ({top:$ (' # ' +selectid+ ' H4 '). Outerheight (True)});
$ (window). Scroll (function () {
Windowspace = ($ (window). scrolltop () + document.documentElement.clientHeight)-$ (' # ' +selectid). Offset (). Top;
Windowspace < ulspace?$ (' # ' +selectid+ ' ul '). css ({top:-ulspace}): $ (' # ' +selectid+ ' ul '). CSS ({top:$ (' # ' +selectid+ ') H4 '). Outerheight (True)};
});
$ (' # ' +selectid+ ' Li '). Click (function (e) {
Selectindex = $ (' # ' +selectid+ ' li '). index (this);
$.fn.keydown (Selectid,selectindex);
$ (' # ' +selectid+ ' H4 '). Empty (). Append ($ (' # ' +selectid+ ' option:selected '). text ());
$.fn.clearselectmenu (Selectid,selectzindex);
E.stoppropagation ();
E.cancelbubble = true;
})
. Hover (
function () {
$ (' # ' +selectid+ ' Li '). Removeclass ("over");
$ (this). addclass ("Over"). AddClass ("Selectedli");
Selectindex = $ (' # ' +selectid+ ' li '). index (this);
},
function () {
$ (this). Removeclass ("over");
}
);
}
$ (' # ' +selectid)
. Bind ("Focus", function () {
$.fn.clearselectmenu (Selectid,selectzindex);
$ (' # ' +selectid+ ' H4 '). AddClass ("over");
})
. bind ("click", Function (e) {
if ($ (' # ' +selectid+ ' ul '). CSS ("display") = = ' block ') {
$.fn.clearselectmenu (Selectid,selectzindex);
return false;
}else{
Click_fun ();
};
E.stoppropagation ();
})
. Bind ("MouseOver", function (e) {
if ($ (' # ' +selectid+ ' ul '). CSS ("display") = = ' block ') {
$.fn.clearselectmenu (Selectid,selectzindex);
return false;
}else{
Click_fun ();
};
E.stoppropagation ();
})
. Bind ("Mouseout", function (e) {
if ($ (' # ' +selectid+ ' ul '). CSS ("display") = = ' block ') {
Timeobj = settimeout (function () {
$.fn.clearselectmenu (Selectid,selectzindex);
},500);
return false;
}
E.stoppropagation ();
})
. bind (' MouseWheel ', function (E,delta) {
E.preventdefault ();
var MouseWheel = {
$obj: $ (' # ' +selectid+ ' Li.over '),
$slength: $ (' # ' +selectid+ ' option '). Length,
Mup:function () {
this. $obj. Removeclass ("over");
Selectindex = = 0?selectindex = 0:selectindex--;
$.fn.keydown (Selectid,selectindex);
},
Mdown:function () {
this. $obj. Removeclass ("over");
Selectindex = = (this. $slength-1)? selectindex = this. $slength -1:selectindex + +;
$.fn.keydown (Selectid,selectindex);
}
}
Delta>0?mousewheel.mup (): Mousewheel.mdown ();
})
. Bind ("DblClick", function () {
$.fn.clearselectmenu (Selectid,selectzindex);
return false;
})
. Bind ("KeyDown", function (e) {
$ (this). bind (' KeyDown ', function (e) {
if (E.keycode = = | | e.keycode = = | | e.keycode = + | | e.keycode = 36) {
return false;
}
});
var $obj = $ (' # ' +selectid+ ' Li.over '), $slength = $ (' # ' +selectid+ ' option '). length;
Switch (e.keycode) {
Case 9:
return true;
Break
Case 13:
Enter
$.fn.clearselectmenu (Selectid,selectzindex);
Break
Case 27:
Esc
$.fn.clearselectmenu (Selectid,selectzindex);
Break
Case 33:
$obj. Removeclass ("over");
Selectindex = 0;
$.fn.keydown (Selectid,selectindex);
Break
Case 34:
$obj. Removeclass ("over");
Selectindex = ($slength-1);
$.fn.keydown (Selectid,selectindex);
Break
Case 35:
$obj. Removeclass ("over");
Selectindex = ($slength-1);
$.fn.keydown (Selectid,selectindex);
Break
Case 36:
$obj. Removeclass ("over");
Selectindex = 0;
$.fn.keydown (Selectid,selectindex);
Break
Case 38:
Up
E.preventdefault ();
$obj. Removeclass ("over");
Selectindex = = 0?selectindex = 0:selectindex--;
$.fn.keydown (Selectid,selectindex);
Break
Case 40:
Down
E.preventdefault ();
$obj. Removeclass ("over");
Selectindex = = ($slength-1)? selectindex = $slength -1:selectindex + +;
$.fn.keydown (Selectid,selectindex);
Break
Default
E.preventdefault ();
Break
};
})
. Bind ("Blur", function () {
$.fn.clearselectmenu (Selectid,selectzindex);
return false;
})
. Bind ("Selectstart", function () {
return false;
});
}else if ($ (this). Parents () [0].id.indexof (' __jqselect ') >0) {
Selectid = $ (this). Parents () [0].id;
$.fn.setselectvalue (Selectid);
var selectwidth=$ (' # ' +selectid+ ' select '). width ();
if ($.browser.safari) {selectwidth = selectwidth+15}
$ (' # ' +selectid+ ' H4 '). css ({width:selectwidth});
var selectulwidth = selectwidth + parseint ($ (' # ' +selectid+ ' H4 '). CSS ("Padding-left")) + parseint ($ (' # ' +selectid+ ' H4 '). CSS ("Padding-right"));
$ (' # ' +selectid+ ' ul '). css ({width:selectulwidth+ ' px '});
if (This.style.display!= ' None ') {$ (this). Hide ();}
}})},
Clearselectmenu:function (Selectid,selectzindex) {
if (selectid!= undefined) {
Selectzindex = selectzindex| | ' Auto ';
$ (' # ' +selectid+ ' ul '). Empty (). Hide ();
$ (' # ' +selectid+ ' H4 '). Removeclass ("Over")-Removeclass ("current");
$ (' # ' +selectid). css ({' Z-index ': Selectzindex});
}
},
Setselectvalue:function (SID) {
var content = [];
$.each (' # ' +sid+ ' option '), function (i) {
Content.push ("<li class= ' Fixselectbrowser ' >" +$ (This). Text () + "</li>");
});
Content = Content.join (');
$ (' # ' +sid+ ' UL '). HTML (content);
$ (' # ' +sid+ ' h4 '). HTML ($ (' # ' +sid+ ' option:selected '). text ());
$ (' # ' +sid+ ' li '). EQ ($ (' # ' +sid+ ' select ') [0].selectedindex]. addclass ("Over"). AddClass ("Selectedli");
},
Keydown:function (Sid,selectindex) {
var $obj = $ (' # ' +sid+ ' select ');
$obj [0].selectedindex = Selectindex;
$obj. Change ();
$ (' # ' +sid+ ' Li:eq (' +selectindex+ '). Toggleclass ("over");
$ (' # ' +sid+ ' h4 '). HTML ($ (' # ' +sid+ ' option:selected '). text ());
}
});
var types = [' Dommousescroll ', ' MouseWheel '];
$.event.special.mousewheel = {
Setup:function () {
if (This.addeventlistener)
for (var i=types.length; i;)
This.addeventlistener (Types[--i], Handler, false);
Else
This.onmousewheel = handler;
},
Teardown:function () {
if (This.removeeventlistener)
for (var i=types.length; i;)
This.removeeventlistener (Types[--i], Handler, false);
Else
This.onmousewheel = null;
}
};
$.fn.extend ({
Mousewheel:function (FN) {
RETURN FN? This.bind ("MouseWheel", fn): This.trigger ("MouseWheel");
},
Unmousewheel:function (FN) {
Return This.unbind ("MouseWheel", FN);
}
});
function Handler (event) {
var args = [].slice.call (arguments, 1), Delta = 0, returnvalue = true;
event = $.event.fix (Event | | window.event);
Event.type = "MouseWheel";
if (event.wheeldelta) delta = event.wheeldelta/120;
if (event.detail) delta =-EVENT.DETAIL/3;
Args.unshift (event, Delta);
Return $.event.handle.apply (this, args);
}
}) (JQuery);

Demo Address http://demo.jb51.net/js/jQuery.Select/index.html
Package Download http://www.jb51.net/jiaoben/21397.html