(function($) { $.fn.fixedSidebar = function(options) { var defaults = { 100, height: 20, horizontalType: 'left', /*left,right*/ horizontalValue:20, verticalType:'top', /*top,bottom*/ verticalValue:30, berth:'browser', /*browser,wrap*/ wrapWidth:960, isHide:false, scrollTop:120, content:'' }; var opts = $.extend(defaults, options); var floatBlock = 'floatBlock_' + Math.round(Math.random() * 10000); var positiontype = 'undefined' == typeof(document.body.style.maxHeight) ? "absolute" : "fixed"; if (opts.horizontalType != 'left' && opts.horizontalType != 'right') { opts.horizontalType = 'left'; } if (opts.verticalType != 'top' && opts.verticalType != 'bottom') { opts.verticalType = 'top'; } var horizontalValue=0; var verticalValue=0; setHorizontalValue(); setVerticalValue(); $("body").append('<div id="' + floatBlock + '" style="'+opts.width+'px;height:'+opts.height+'px;position:' + positiontype + ';top:' + verticalValue + 'px;' + opts.horizontalType + ':' + horizontalValue + 'px;z-index:999;overflow:hidden;">'+opts.content+'</div>'); if(opts.isHide) { $("#" + floatBlock + "").hide(); } $(window).scroll(function() { if ('undefined' == typeof(document.body.style.maxHeight)) { setVerticalValue(); $("#" + floatBlock + "").css('top', verticalValue + "px"); } if(opts.isHide) { if($(window).scrollTop()>opts.scrollTop) { $("#" + floatBlock + "").slideDown(); } else { $("#" + floatBlock + "").slideUp(); } } }) $(window).resize(function() { setHorizontalValue(); $("#" + floatBlock + "").css(opts.horizontalType, horizontalValue + "px"); setVerticalValue(); $("#" + floatBlock + "").css('top', verticalValue + "px"); }) function setHorizontalValue() { horizontalValue = opts.berth == 'wrap' ? ($(window).width()-opts.wrapWidth)/2-opts.width-opts.horizontalValue : opts.horizontalValue; } function setVerticalValue() { if ('undefined' == typeof(document.body.style.maxHeight)) { verticalValue = opts.verticalType == 'top' ? $(window).scrollTop()+opts.verticalValue : $(window).scrollTop()+$(window).height()-opts.verticalValue; } else { verticalValue = opts.verticalType == 'top' ? opts.verticalValue : $(window).height()-opts.verticalValue; } } }; })(jQuery)