﻿/*
滑动控件
by zqy
2011-06-08
*/
(function($) {
    $.fn.slider = function(setting) {
        var control = $(this); //获得触发滑动的控件
        var autoCloseTimeoutID = ""; //自动关闭timeout对象ID
        var showButtonLeft, showButtonTop;
        //设置参数
        setting = $.extend($.fn.slider.defaults, setting);

        //滑出事件
        var sliderOut = function() {
            //alert(setting.speed);
            control.css({
                'position': 'relative'
            });
            control.slideDown(setting.speed);
        }

        //滑入事件
        var sliderIn = function() {
            //获得显示按钮的位置
            if (setting.showButton) {
                if ($("#btnSliderShow").size() == 0) {
                    showButtonLeft = control.position().left + control.width() + 5;
                    showButtonTop = control.position().top;
                }
            }
            control.slideUp(setting.autoCloseSpeed, function() {
                //添加显示按钮
                if ($("#btnSliderShow").size() == 0) {
                    if (setting.showButton) {
                        control.css({
                            'position': ''
                        });
                        var showButtonHtmls = "<div id='btnSliderShow' title='显示'>显示</div>"; //关闭按钮html代码
                        $("body").append(showButtonHtmls);
                        //显示按钮的最基本设置
                        $("#btnSliderShow").css({
                            'position': 'absolute',
                            'cursor': 'hand',
                            'display': 'none'
                        });
                        if (setting.showButtonHtmls != "") {
                            $("#btnSliderShow").html(setting.showButtonHtmls);
                        } else {
                            $("#btnSliderShow").css({
                                'width': '20px',
                                'height': '45px',
                                'padding-top': '10px',
                                'background': '#E0E0E0',
                                'border': '2px solid #D8CACA',
                                'color': 'white',
                                'text-align': 'center',
                                'font-weight': 'bold',
                                'font-size': '15px'
                            });
                        }
                        //根据滑动控件位置设置显示按钮
                        $("#btnSliderShow").css({
                            'left': showButtonLeft,
                            'top': showButtonTop
                        });
                        //显示滑动控件
                        $("#btnSliderShow").click(function() {
                            $("#btnSliderShow").hide();
                            //设置自动关闭
                            sliderAutoIn();
                            sliderOut();
                        })
                    }
                }
                $("#btnSliderShow").show();
            });
        }
        //自动滑入事件
        var sliderAutoIn = function() {
            if (setting.autoCloseTimes > 0) {
                autoCloseTimeoutID = setTimeout(function() {
                    sliderIn();
                }, setting.autoCloseTimes);
            }
        }
        //添加关闭按钮
        if (setting.closeButton) {
            var closeButtonHtmls = "<div id='btnSliderClose' title='关闭'>×</div>"; //关闭按钮html代码
            control.append(closeButtonHtmls);
            $("#btnSliderClose", control).css({
                'position': 'absolute',
                'right': '0px',
                'top': '0px',
                'width': '20px',
                'height': '15px',
                'background': 'white',
                'border': '2px solid #E0E0E0',
                'color': '#E0E0E0',
                'line-height': '15px',
                'text-align': 'center',
                'font-weight': 'bold',
                'font-size': '15px',
                'cursor': 'hand'
            });
            //添加关闭事件
            $("#btnSliderClose", control).click(function() {
                sliderIn();
            });
        }

        //设置自动关闭
        sliderAutoIn();

        //鼠标移上事件，取消自动关闭
        control.bind("mouseover", function() {
            if (autoCloseTimeoutID != "") {
                clearTimeout(autoCloseTimeoutID);
            }
        });
        //鼠标移开事件，添加自动关闭
        control.bind("mouseout", function() {
            sliderAutoIn();
        });

        //滑出
        sliderOut();

    }

    //定义全局参数
    $.fn.slider.defaults = {
        autoCloseTimes: 5000,   //自动关闭时间，设置0表示不自动关闭
        autoCloseSpeed: 1000,   //自动关闭滑入的速度
        closeButton: true,      //关闭按钮
        showButton: true,       //显示按钮
        showButtonHtmls: '',    //显示按钮html代码
        speed: 800              //滑出速度
    }

})(jQuery);
