jQuery.fn.sSelect = function () {
    var selectId = $(this).attr('id');
    var selectIndex;
    $('#' + selectId).append('<div class="dropselectbox"><h4><span></span><em></em></h4><ul style="display:none"></ul></div>');
    $.each($('#' + selectId + ' > select > option'), function (i) {
        if ($(this).attr("selected") == true) {
            $('#' + selectId + ' > div > h4 >em').empty().append($(this).text());
        }
    });
    $('.dropselectbox').show();
    $('#' + selectId + ' > select').hide();
    $('#' + selectId).bind("click", function (e) {
        selectId = $(this).attr('id');
        if ($('#' + selectId + ' > div > ul').css("display") == 'block') {
            $('.dropselectbox > ul').empty().hide();
            $('.dropselectbox > h4').removeClass("over");
        } else {
            $('#' + selectId + ' > div > ul').empty().toggle();
            $('#' + selectId + ' > div > h4').toggleClass("over");
            setSelectValue(selectId);
            //select option
            $('#' + selectId + ' > div > ul > li').click(function (e) {
                selectIndex = $('#' + selectId + ' > div > ul > li').index($(this)[0]);
                $('#' + selectId + '> select')[0].selectedIndex = selectIndex;
                getCssFile();
                setSelectValue(selectId);
                cleadMenu();
                e.stopPropagation()
            })
			.hover(
					function (e) {
					    $('#' + selectId + ' > div > ul > li').removeClass("over");
					    $(this).addClass("over");
					    selectIndex = $('#' + selectId + ' > div > ul > li').index($(this)[0]);
					    //var pos = GetmousePosition(e);
					    //var x = $(document).width() - 240;
					    var offset = $(this).offset();
					    //$("#selectTips").css("top", (pos[1] + 20) + "px").css("left", x + "px").css("width", $(this).width());
					    $("#selectTips").css("top", (offset.top+20) + "px").css("left", offset.left + "px").css("width", $(this).width());
					    $("#selectTips").html($('#' + selectId + '> select > option').eq(selectIndex).val()).show();
					},
					function () {
					    $(this).removeClass("over");
					    $("#selectTips").hide();
					}
			);
            $(document).bind("click", cleadMenu);
        }
        e.stopPropagation()
    })
	.bind("selectstart", function () {
	    return false;
	})
	.bind("blur", function () {
	    cleadMenu();
	});
}

function GetmousePosition(ev) {
    if (ev.pageX || ev.pageY) {
        return [ev.pageX, ev.pageY];
    }
    return [
        ev.clientX + document.body.scrollLeft - document.body.clientLeft,
        ev.clientY + document.body.scrollTop - document.body.clientTop
    ];
}

function cleadMenu(){
	$('.dropselectbox > ul').empty().hide();
	$('.dropselectbox > h4').removeClass("over");
	$("#selectTips").hide();
	$(document).unbind("click",cleadMenu);
}

function setSelectValue(sID){
    $.each($('#' + sID + ' > select > option'), function (i) {
        $('#' + sID + ' > div > ul').append("<li>" + $(this).text() + "</li>");
        if ($(this).attr("selected") == true) {
            $('#' + sID + ' > div > h4>em').empty().append($(this).text());
            $('#' + sID + ' > div > ul > li').eq(i).addClass("over").addClass("selectedli");
        }
    });
} 
