X2延迟加载图片增加滚动图标

找到static/js/forum_viewthread.js

查找

1. function lazyload(className) {
   
2. var obj = this;
   
3. lazyload.className = className;
   
4. this.getOffset = function (el, isLeft) {
   
5. var retValue = 0 ;
   
6. while (el != null ) {
   
7. retValue += el["offset" + (isLeft ? "Left" : "Top" )];
   
8. el = el.offsetParent;
   
9. }
   
10. return retValue;
    
11. };
    
12. this.initImages = function (ele) {
    
13. lazyload.imgs = [];
    
14. var eles = lazyload.className ? $C(lazyload.className, ele) : [document.body];
    
15. for (var i = 0; i < eles.length; i++) {
    
16. var imgs = eles[i].getElementsByTagName('IMG');
    
17. for(var j = 0; j < imgs.length; j++) {
    
18. if(imgs[j].getAttribute('file') && !imgs[j].getAttribute('lazyloaded')) {
    
19. if(this.getOffset(imgs[j]) > document.documentElement.clientHeight) {
    
20. lazyload.imgs.push(imgs[j]);
    
21. } else {
    
22. imgs[j].setAttribute('src', imgs[j].getAttribute('file'));
    
23. }
    
24. }
    
25. }
    
26. }
    
27. };
    
28. this.showImage = function() {
    
29. this.initImages();
    
30. if(!lazyload.imgs.length) return false;
    
31. var imgs = [];
    
32. var scrollTop = Math.max(document.documentElement.scrollTop , document.body.scrollTop);
    
33. for (var i=0; i<lazyload.imgs.length; i++) {
    
34. var img = lazyload.imgs[i];
    
35. var offsetTop = this.getOffset(img);
    
36. if (offsetTop > document.documentElement.clientHeight && (offsetTop - scrollTop < document.documentElement.clientHeight)) {
    
37. img.setAttribute('src', img.getAttribute('file') ? img.getAttribute('file') : img.getAttribute('src'));
    
38. img.setAttribute('lazyloaded', true);
    
39. } else {
    
40. imgs.push(img);
    
41. }
    
42. }
    
43. lazyload.imgs = imgs;
    
44. return true;
    
45. };
    
46. this.initImages();
    
47. _attachEvent(window, 'scroll', function(){obj.showImage();});
    
48. }

复制代码

替换为

1. function lazyload(className) {
   
2. var obj = this;
   
3. lazyload.className = className;
   
4. this.getOffset = function (el, isLeft) {
   
5. var retValue = 0 ;
   
6. while (el != null ) {
   
7. retValue += el["offset" + (isLeft ? "Left" : "Top" )];
   
8. el = el.offsetParent;
   
9. }
   
10. return retValue;
    
11. };
    
12. this.initImages = function (ele) {
    
13. lazyload.imgs = [];
    
14. var eles = lazyload.className ? $C(lazyload.className, ele) : [document.body];
    
15. for (var i = 0; i < eles.length; i++) {
    
16. var imgs = eles[i].getElementsByTagName('IMG');
    
17. for(var j = 0; j < imgs.length; j++) {
    
18. if(imgs[j].getAttribute('file') && !imgs[j].getAttribute('lazyloaded')) {
    
19. if(this.getOffset(imgs[j]) > document.documentElement.clientHeight) {
    
20. lazyload.imgs.push(imgs[j]);
    
21. } else {
    
22. imgs[j].setAttribute('src', imgs[j].getAttribute('file'));
    
23. imgs[j].setAttribute('lazyloaded', 'true');
    
24. }
    
25. }
    
26. }
    
27. }
    
28. };
    
29. this.showImage = function() {
    
30. this.initImages();
    
31. if(!lazyload.imgs.length) return false;
    
32. var imgs = [];
    
33. var scrollTop = Math.max(document.documentElement.scrollTop , document.body.scrollTop);
    
34. for (var i=0; i<lazyload.imgs.length; i++) {
    
35. var img = lazyload.imgs[i];
    
36. var offsetTop = this.getOffset(img);
    
37. if (!img.getAttribute('lazyloaded') && offsetTop > document.documentElement.clientHeight && (offsetTop - scrollTop < document.documentElement.clientHeight)) {
    
38. var dom = document.createElement('div');
    
39. var width = img.getAttribute('width') ? img.getAttribute('width') : 100;
    
40. var height = img.getAttribute('height') ? img.getAttribute('height') : 100;
    
41. dom.innerHTML = '<div style="width: '+width+'px; height: '+height+'px;background: url('+IMGDIR + '/loading.gif) no-repeat center center;"></div>';
    
42. img.parentNode.insertBefore(dom.childNodes[0], img);
    
43. img.onload = function () {if(!this.getAttribute('_load')) {this.setAttribute('_load', 1);this.style.width = this.style.height = '';this.parentNode.removeChild(this.previousSibling);}};
    
44. img.style.width = img.style.height = '1px';
    
45. img.setAttribute('src', img.getAttribute('file') ? img.getAttribute('file') : img.getAttribute('src'));
    
46. img.setAttribute('lazyloaded', true);
    
47. } else {
    
48. imgs.push(img);
    
49. }
    
50. }
    
51. lazyload.imgs = imgs;
    
52. return true;
    
53. };
    
54. this.showImage();
    
55. _attachEvent(window, 'scroll', function(){obj.showImage();});
    
56. }
    
57. function update_collection(){
    
58. sum = 1;
    
59. $('collectionnumber').innerText = parseInt($('collectionnumber').innerText)+sum;
    
60. }

复制代码

图标有了但是外链图片不能缩放郁闷啊

试试看