I have been paying attention to Jquery before. lazyLoad. js is a special effect, but it has never been used. I have studied it over the past few days and applied it in practice. It does not help SEO, but it can save some traffic, this is especially important for large websites. I cannot count how much traffic is saved. The versions downloaded from the Internet are more or less prone to bugs, especially the flash on IE6 and IE7 after loading. after a long time of searching on the internet, no related solutions have been found. If there is no solution, we have to take advantage of our DIY spirit, solve it by our own ideas, analyze the BUG, handle the logic, and solve Jquery by combining the methods I used to bring up window special effects some time ago. lazyLoad. for details about js compatibility, I will share with you the ideas and methods.
The solution is roughly two points. One is to start with the filter parameters of LazyLoad, and find that there is a parameter that can be used in IE6 and IE7, that is, show, this special effect is used in IE6 and IE7; the second is that non-IE core browsers such as IE8 and later (including IE8), FireFox and Chrome support the special effect of fadeIn, in these browsers, this cool special effect will be used.
When the idea comes out, we can find a solution:
1. First, use JQ to determine the browser type and version. If the browser is IE8 or earlier, use effect = show; otherwise, use effect = fadeIn. The function for judging the browser version is as follows:
The Code is as follows:
Function checkbrowse (){
Var ua = navigator. userAgent. toLowerCase ();
Var is = (ua. match (/\ B (chrome | opera | safari | msie | firefox) \ B/) | ['', 'mozilla ']) [1];
Var r = '(? : '+ Is +' | version) [\/:] ([\ d.] + )';
Var v = (ua. match (new RegExp (r) | []) [1];
JQuery. browser. is = is;
JQuery. browser. ver = v;
Return {
'Is': jQuery. browser. is,
'Ver ': jQuery. browser. ver
}
}
I added the above Code to the JQ package for future use. The path is http://demo.jb51.net/js/2011/lazyload/js/lazyload/jquery.js.
2. Transform the Jquery. LazyLoad. js function to display different filter effects based on the browser version:
The Code is as follows:
Var public = checkbrowse ();
Var showeffect = "";
If (public ['IS'] = 'msie '& public ['ver'] <8.0 )){
Showeffect = "show"
} Else {
Showeffect = "fadeIn"
}
JQuery (document). ready (function ($ ){
$ ("Img"). lazyload ({
Placeholder: "http://demo.jb51.net/js/2011/lazyload/Js/lazyload/grey.gif ",
Effect: showeffect,
Failurelimit: 10
})
});
Jquery. LazyLoad. js usage:
1. Store the following files in the same directory:
Jquery. js
Jquery. layzload. js
Grey.gif
2. Add the following code where special effects are needed:
