-/*--------------------------------------------------------------------
- *JAVASCRIPT "FakeLoader.js"
- *Version: 1.1.0 - 2014
- *author: João Pereira
- *website: http://www.joaopereira.pt
- *Licensed MIT
------------------------------------------------------------------------*/
-(function ($) {
-
- $.fn.fakeLoader = function(options) {
- //Defaults
- $.fn.settings = $.extend({
- timeToHide:10, // Default Time to hide fakeLoader
- pos:'fixed',// Default Position
- top:'0px', // Default Top value
- left:'0px', // Default Left value
- width:'100%', // Default width
- height:'100%', // Default Height
- zIndex: '999', // Default zIndex
- bgColor: '#2ecc71', // Default background color
- opacity:'0.6',//默认透明度
- text:'',//默认加载中文字
- spinner:'spinner1', // Default Spinner
- imagePath:'' // Default Path custom image
- }, options);
- var timer=null;
- $.fn.Setopacity=function(opacity){
- $(".loadingbackground").fadeTo("slow",opacity);
- };
- $.fn.SetTimeToHide=function(timetohide){
- var el = $(this);
- el.settings.timeToHide=timetohide;
- if(!!timer)clearTimeout(timer);
- el.css({
- 'display':"block"
- });//fadeTo("fast",el.settings.opacity);
- $(".loadingbackground").fadeTo(1,el.settings.opacity);
- setTimeout(function(){
- el.fadeOut();//fadeTo("slow",0);
- }, el.settings.timeToHide);
- };
- $.fn.setToHide=function(){
- var el = $(this);
- if(!!timer)clearTimeout(timer);
- el.fadeOut();//fadeTo("slow",0);
- };
- //The target
- var el = $(this);
-
- //Customized Spinners
- var spinner01 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner1"><div class="double-bounce1"></div><div class="double-bounce2"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';
- var spinner02 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner2"><div class="spinner-container container1"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div><div class="spinner-container container2"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div><div class="spinner-container container3"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';
- var spinner03 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner3"><div class="dot1"></div><div class="dot2"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div></div>';
- var spinner04 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner4"></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';
- var spinner05 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner5"><div class="cube1"></div><div class="cube2"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';
- var spinner06 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner6"><div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div><div class="rect5"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';
- var spinner07 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner7"><div class="circ1"></div><div class="circ2"></div><div class="circ3"></div><div class="circ4"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';
-
- //Init styles
- var initStyles = {
- 'position':el.settings.pos,
- 'width':el.settings.width,
- 'height':el.settings.height,
- 'top':el.settings.top,
- 'left':el.settings.left
- };
-
- //Apply styles
- el.css(initStyles);
- //Each
- el.each(function() {
- var a = el.settings.spinner;
- //console.log(a)
- switch (a) {
- case 'spinner1':
- el.html(spinner01);
- break;
- case 'spinner2':
- el.html(spinner02);
- break;
- case 'spinner3':
- el.html(spinner03);
- break;
- case 'spinner4':
- el.html(spinner04);
- break;
- case 'spinner5':
- el.html(spinner05);
- break;
- case 'spinner6':
- el.html(spinner06);
- break;
- case 'spinner7':
- el.html(spinner07);
- break;
- default:
- el.html(spinner01);
- }
-
- //Add customized loader image
-
- if (el.settings.imagePath !='') {
- el.html('<div class="fl"><img src="'+el.settings.imagePath+'"><span>'+el.settings.text+'</span></div>');
- }
- centerLoader();
- });
-
- //Time to hide fakeLoader
- if(el.settings.timeToHide>0){
- timer=setTimeout(function(){
- el.fadeOut();//fadeTo("slow",0);
- }, el.settings.timeToHide);
- }
- //Return Styles
- this.css({
- //'backgroundColor':el.settings.bgColor,
- 'display':"block",
- 'zIndex':el.settings.zIndex
- });
-
- $(".loadingbackground").css(initStyles).css({
- 'backgroundColor':el.settings.bgColor,
- 'opacity':el.settings.opacity,
- 'zIndex':el.settings.zIndex+1
- });
- $(".loadingTip").css(initStyles).css({
- //'backgroundColor':el.settings.bgColor,
- 'zIndex':el.settings.zIndex+2
- });
- return this;
- }; // End Fake Loader
-
-
- //Center Spinner
- function centerLoader() {
-
- var winW = $(window).width();
- var winH = $(window).height();
-
- var spinnerW = $('.fl').outerWidth();
- var spinnerH = $('.fl').outerHeight();
- var fW = $('.f2').outerWidth();
- var left=(winW/2)-(spinnerW/2);
- var left2=(winW/2)-(fW/2);
- left=left>0?left:winW/2-20;
- left2=left2==0||fW==0?left:left2;
- //left2=left2>0?left2:winW/2-40;
- left2=left2-20;
- console.log("loding gif:"+left+" text:"+left2);
- $('.fl').css({
- 'position':'absolute',
- 'left':left,
- 'top':(winH/2)-(spinnerH/2)
- });
- $('.f2').css({
- 'position':'absolute',
- 'left':left2,
- 'top':(winH/2)+(spinnerH/2)
- });
- }
-
- $(window).load(function(){
- centerLoader();
- $(window).resize(function(){
- centerLoader();
- });
- });
-
-
-}(jQuery));
-
-
-
-
+/*--------------------------------------------------------------------\r
+ *JAVASCRIPT "FakeLoader.js"\r
+ *Version: 1.1.0 - 2014\r
+ *author: João Pereira\r
+ *website: http://www.joaopereira.pt\r
+ *Licensed MIT \r
+-----------------------------------------------------------------------*/\r
+(function ($) {\r
+ \r
+ $.fn.fakeLoader = function(options) {\r
+ //Defaults\r
+ $.fn.settings = $.extend({\r
+ timeToHide:10, // Default Time to hide fakeLoader\r
+ pos:'fixed',// Default Position\r
+ top:'0px', // Default Top value\r
+ left:'0px', // Default Left value\r
+ width:'100%', // Default width \r
+ height:'100%', // Default Height\r
+ zIndex: '999', // Default zIndex \r
+ bgColor: '#2ecc71', // Default background color\r
+ opacity:'0.6',//默认透明度\r
+ text:'',//默认加载中文字\r
+ spinner:'spinner1', // Default Spinner\r
+ imagePath:'' // Default Path custom image\r
+ }, options);\r
+ var timer=null;\r
+ $.fn.Setopacity=function(opacity){\r
+ $(".loadingbackground").fadeTo("slow",opacity);\r
+ };\r
+ $.fn.SetTimeToHide=function(timetohide){\r
+ var el = $(this);\r
+ el.settings.timeToHide=timetohide;\r
+ if(!!timer)clearTimeout(timer);\r
+ el.css({\r
+ 'display':"block"\r
+ });//fadeTo("fast",el.settings.opacity);\r
+ $(".loadingbackground").fadeTo(1,el.settings.opacity);\r
+ setTimeout(function(){\r
+ el.fadeOut();//fadeTo("slow",0);\r
+ }, el.settings.timeToHide);\r
+ };\r
+ $.fn.setToHide=function(){\r
+ var el = $(this);\r
+ if(!!timer)clearTimeout(timer);\r
+ el.fadeOut();//fadeTo("slow",0);\r
+ };\r
+ //The target\r
+ var el = $(this);\r
+\r
+ //Customized Spinners\r
+ var spinner01 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner1"><div class="double-bounce1"></div><div class="double-bounce2"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';\r
+ var spinner02 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner2"><div class="spinner-container container1"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div><div class="spinner-container container2"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div><div class="spinner-container container3"><div class="circle1"></div><div class="circle2"></div><div class="circle3"></div><div class="circle4"></div></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';\r
+ var spinner03 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner3"><div class="dot1"></div><div class="dot2"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div></div>';\r
+ var spinner04 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner4"></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';\r
+ var spinner05 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner5"><div class="cube1"></div><div class="cube2"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';\r
+ var spinner06 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner6"><div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div><div class="rect5"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';\r
+ var spinner07 = '<div class="loadingbackground"></div><div class="loadingTip"><div class="fl spinner7"><div class="circ1"></div><div class="circ2"></div><div class="circ3"></div><div class="circ4"></div></div><br><div class="f2"><span class="loading">'+el.settings.text+'</span></div>';\r
+\r
+ //Init styles\r
+ var initStyles = {\r
+ 'position':el.settings.pos,\r
+ 'width':el.settings.width,\r
+ 'height':el.settings.height,\r
+ 'top':el.settings.top,\r
+ 'left':el.settings.left\r
+ };\r
+\r
+ //Apply styles\r
+ el.css(initStyles); \r
+ //Each \r
+ el.each(function() {\r
+ var a = el.settings.spinner;\r
+ //console.log(a)\r
+ switch (a) {\r
+ case 'spinner1':\r
+ el.html(spinner01);\r
+ break;\r
+ case 'spinner2':\r
+ el.html(spinner02);\r
+ break;\r
+ case 'spinner3':\r
+ el.html(spinner03);\r
+ break;\r
+ case 'spinner4':\r
+ el.html(spinner04);\r
+ break;\r
+ case 'spinner5':\r
+ el.html(spinner05);\r
+ break;\r
+ case 'spinner6':\r
+ el.html(spinner06);\r
+ break;\r
+ case 'spinner7':\r
+ el.html(spinner07);\r
+ break;\r
+ default:\r
+ el.html(spinner01);\r
+ }\r
+\r
+ //Add customized loader image\r
+\r
+ if (el.settings.imagePath !='') {\r
+ el.html('<div class="fl"><img src="'+el.settings.imagePath+'"><span>'+el.settings.text+'</span></div>');\r
+ }\r
+ centerLoader();\r
+ });\r
+ \r
+ //Time to hide fakeLoader\r
+ if(el.settings.timeToHide>0){\r
+ timer=setTimeout(function(){\r
+ el.fadeOut();//fadeTo("slow",0);\r
+ }, el.settings.timeToHide);\r
+ }\r
+ //Return Styles \r
+ this.css({\r
+ //'backgroundColor':el.settings.bgColor,\r
+ 'display':"block",\r
+ 'zIndex':el.settings.zIndex\r
+ });\r
+ \r
+ $(".loadingbackground").css(initStyles).css({\r
+ 'backgroundColor':el.settings.bgColor,\r
+ 'opacity':el.settings.opacity,\r
+ 'zIndex':el.settings.zIndex+1\r
+ });\r
+ $(".loadingTip").css(initStyles).css({\r
+ //'backgroundColor':el.settings.bgColor,\r
+ 'zIndex':el.settings.zIndex+2\r
+ });\r
+ return this;\r
+ }; // End Fake Loader\r
+ \r
+\r
+ //Center Spinner\r
+ function centerLoader() {\r
+\r
+ var winW = $(window).width();\r
+ var winH = $(window).height();\r
+\r
+ var spinnerW = $('.fl').outerWidth();\r
+ var spinnerH = $('.fl').outerHeight();\r
+ var fW = $('.f2').outerWidth();\r
+ var left=(winW/2)-(spinnerW/2);\r
+ var left2=(winW/2)-(fW/2);\r
+ left=left>0?left:winW/2-20;\r
+ left2=left2==0||fW==0?left:left2;\r
+ //left2=left2>0?left2:winW/2-40;\r
+ left2=left2-20;\r
+ console.log("loding gif:"+left+" text:"+left2);\r
+ $('.fl').css({\r
+ 'position':'absolute',\r
+ 'left':left,\r
+ 'top':(winH/2)-(spinnerH/2)\r
+ });\r
+ $('.f2').css({\r
+ 'position':'absolute',\r
+ 'left':left2,\r
+ 'top':(winH/2)+(spinnerH/2)\r
+ });\r
+ }\r
+\r
+ $(window).load(function(){\r
+ centerLoader();\r
+ $(window).resize(function(){\r
+ centerLoader();\r
+ });\r
+ });\r
+\r
+\r
+}(jQuery));\r
+\r
+\r
+\r
+\r