Java代码
- (function(){
- //作用域定义
- var xproject = this.xproject || function(){};
- this.xproject = xproject;
- /*
- * @description全屏背景图类 xproject.fullBackBround({ bgImg : 'images/2014022709240529.jpg'});
- * @param args
- * {
- * $layer : jQuery 容器
- * bgImg : String, //背景图片地址url,默认null
- * zIndex : int //z-index值,默认-1
- * }
- */
- xproject.fullBackBround = function(args){
- var $layer = args.$layer || $('body'),
- $bg = $('<div class="full-bg" style="overflow:hidden;position:fixed;left:0;top:0;width:100%;height:100%;z-index:-1;"></div>').appendTo($layer);
- full();
- function full(){
- if(args && typeof args == 'object'){
- if(args.zIndex){
- $bg.css('z-index', args.zIndex);
- }
- if(args.bgImg){
- var img = new Image();
- img.src = args.bgImg;
- if(img.complete){
- complete.call(img);
- }else img.onload = function(){
- complete.call(this, this.height / this.width);
- };
- }
- }
- }
- function complete(per){
- var width = parseInt($bg.width()),
- height = parseInt($bg.height()),
- norPer = height / width;
- per = per || this.height / this.width;
- if(per > norPer){
- height = Math.round(width * per);
- }else if(norPer > per){
- width = Math.round(height / per);
- }
- this.width = width;
- this.height = height;
- $bg.empty().append($(this));
- }
- $(window).on({
- resize : function(){
- full();
- }
- });
- return {
- //移除
- remove : function(){
- $bg.remove();
- },
- //获取页面元素
- getLayer : function(){
- return $bg
- },
- //显示
- show : function(){
- $bg.fadeIn('fast');
- },
- //隐藏
- hide : function(){
- $bg.fadeOut('fast');
- },
- //根据页面重置大小
- resize : function(){
- full();
- },
- //改变地址
- changeUrl : function(url){
- args.bgImg = url;
- full();
- }
- };
- };
- })();
how2use
Java代码
- if(!this.imgBg) this.imgBg = new xproject.fullBackBround({$layer : this.$layer, bgImg : imgUrl});
- this.imgBg.changeUrl(imgUrl);
