//jquery.mslider.js

jQuery.fn.mslider = function(options){
    var opt = jQuery.extend({
        open: 0,  // какой слайд открыт по умалчанию, если 0, то все слайды закрыты
        class_open : 'open',
        class_close : 'hide',
        width_close : 133,
    },options); 

       
    return this.each(function() {
        var wrapper_width = $(this).width();
        var lili = $(this).children('.item');
        var element_width = Math.floor(wrapper_width / lili.length); 
        lili.css('width', element_width+'px');
        lili.children('.hover').css({
            'width' : '100%',
        }).attr('class', 'hover close');
        lili.children('.content').css({
            'width' : '0',
        });
        lili.children('.content').append('<div title="Закрыть" class="closer">X</div>');

        lili.children('.content').children('.closer').click(function(){
            
            lili.css('width', element_width+'px');
            lili.children('.hover').animate({
                'width' : '100%',
            }, 300);
            lili.children('.content').animate({
                'width' : '0',
            }, 300);

        });
        
        var this_width = wrapper_width - (opt.width_close * (lili.length - 1));
        
        var el_old_class;
        lili.children('.close').click(function(el){
            lili.css('width', opt.width_close+'px');
            
            lili.children('.content').css({
                'width' : '0',
              //  'display' : 'none'
            });
            lili.children('.hover').css({
                'width' : '100%',
            });
            
            var parent = $(this).parent('.item');
            
            $(this).attr('class', 'hover open');
            
            parent.css('width', this_width);
            parent.children('.hover').animate({
                width : '30px',
            }, 300);
            parent.children('.content').animate({
                width : (this_width - 30) + 'px',
             //   display : 'block'
            }, 300);
            
        });
    });
};

