<small id='4w3fg9s4'></small><noframes id='pyjk1sjb'>

      <tfoot id='tstkg6ry'></tfoot>

      <i id='drueqhnu'><tr id='bg9kk6az'><dt id='rlilkamm'><q id='0qpg2aty'><span id='0crby384'><b id='klu2x89d'><form id='4i3g0m4l'><ins id='9ixtm1w2'></ins><ul id='5c2a9vqj'></ul><sub id='0nh9ip0g'></sub></form><legend id='gjnv007g'></legend><bdo id='jzi2ymhz'><pre id='4p2ilo42'><center id='wibhdohe'></center></pre></bdo></b><th id='lij4mp2b'></th></span></q></dt></tr></i><div id='yuyvpt18'><tfoot id='kiok11ja'></tfoot><dl id='x89ljudd'><fieldset id='rnbpj1g6'></fieldset></dl></div>
        <bdo id='1nkyov1i'></bdo><ul id='t8jhc7fa'></ul>
      <legend id='eeyra3wc'><style id='me02r6r3'><dir id='uic2rc05'><q id='po17yleu'></q></dir></style></legend>

      1. 精准传达 • 价值共享

        洞悉互联网前沿资讯,探寻网站营销规律

        长沙网站前端制作之图片懒加载的功能介绍

        作者: 庚午网络 | 2020-12-06 01:24 |点击:

        长沙企业网站制作

        <i id='uoxx74dv'><tr id='gdj8wsoc'><dt id='sos4lbg0'><q id='x3fv1csw'><span id='cff4vaje'><b id='ljqxky57'><form id='r7nsob18'><ins id='0dyur3sv'></ins><ul id='zkeh2muq'></ul><sub id='hqcmosq6'></sub></form><legend id='wqc0jiiq'></legend><bdo id='rrjsezee'><pre id='ox3ly4yd'><center id='pcwes4is'></center></pre></bdo></b><th id='j3p6rg5i'></th></span></q></dt></tr></i><div id='b3c78sfy'><tfoot id='olq5587d'></tfoot><dl id='whww7wrh'><fieldset id='9bvcyg3m'></fieldset></dl></div>

          • <legend id='ygrwpdsm'><style id='e2faksbx'><dir id='qy64hcyo'><q id='g58pugoa'></q></dir></style></legend>
              • <bdo id='v8vomui5'></bdo><ul id='lusa7az4'></ul>
              • <tfoot id='3hh0htne'></tfoot>

                <small id='6y9rrl0x'></small><noframes id='dl5vh6fa'>

                    <tbody id='kq5607dk'></tbody>

                • 在一次项目中需要做一个电子书,然后再网上找了一个电子书的模板,但是我所做的项目时电子版的图刊,需要加载有很多图片,当完成后上传了100多张图片,这个时候发现加载非常的慢 ,效果要很久才出来,这是我就想到了我以前一个项目当时也是因为网站首页图片太大太多,js插件也多导致首页打开速度奇慢无比 ,后来用图片懒加载稍微优化了一下发现效果还不错,当时是打算用jquery.lazyload.js 去做的,试了半天都发现没有效果于是就自己写了一个简单的图片的懒加载。
                  思路跟网上大家说的差不多,就是在img标签上放一张临时图片 然后定义一个data-img 的属性,然后自己更具网站的实际需求写 替换图片的事件,  我这里是电子书 做的点击事件。
                   

                  前端制作1

                  前端制作2

                   
                  $('#next_page_button').click(function() {
                  var dong_num=  $(this).data('num');
                  var all_num = dong_num+5;
                  $(this).data('num',all_num);
                  $('.lazy').each(function() {
                  var $img = $(this);
                  var img_num = $img.data('num');
                  if (img_num <= all_num) {
                  var dong_num = $img.data('img');
                  $img.attr('src',dong_num);
                  }
                  });
                  });
                   
                  这里是想法是第一次加载只展示5张 然后没触发一次事件就去判断当前的data-num值, 提前加载5张,把num的值小于当前数值num的img标签内的默认图片都替换为需要展示的图片。然后把点击事件上的num值改成当前判断的值,做好下次事件的数值判断。这是一个简单例子,希望能给你们一些解决问题灵感。
                  当然如果网站的布局有规律也可以尝试使用jquery.lazyload.js
                  分享一个lazyload.js详解
                  https://www.cnblogs.com/yzg1/p/5051554.html
                  lazyload.js下载地址是github上的
                  https://codeload.github.com/tuupola/lazyload/legacy.zip/1.9.3
                  二度创作,如有侵权请联系删除。如没特殊注明,文章均为庚午网络原创,转载请注明https://www.hngengwu.com/gengwuwenku/550.html
                • <legend id='x4pjxnrr'><style id='hn2lrk8e'><dir id='v3sgzpp9'><q id='kpuuzjg6'></q></dir></style></legend>
                  • <bdo id='mejb0fbz'></bdo><ul id='gjc2y8dz'></ul>
                  <i id='ojckol6d'><tr id='pxkglla4'><dt id='w5kytbog'><q id='kfav6qru'><span id='81nt1g39'><b id='n0h3ndmf'><form id='l5tixlmb'><ins id='mzpfmr7f'></ins><ul id='cp908wk6'></ul><sub id='zde1yidi'></sub></form><legend id='cjmpepjv'></legend><bdo id='7ps1edtr'><pre id='0op9wihv'><center id='7i1mw6r7'></center></pre></bdo></b><th id='dupf35e5'></th></span></q></dt></tr></i><div id='tmf6ff35'><tfoot id='6gc9hyfy'></tfoot><dl id='7ko0dy6b'><fieldset id='kdk0o2et'></fieldset></dl></div>

                      <small id='lbfw1c8h'></small><noframes id='ras8y4p7'>

                      <tfoot id='0686jggr'></tfoot>
                      多一份策划方案,总有益处。

                      请直接添加技术总监微信联系咨询

                      网站设计 品牌营销

                      多一份参考,总有益处

                      联系庚午网络,获得专属《策划方案》及报价

                      咨询相关问题或预约面谈,可以通过以下方式与我们联系

                      业务热线:18574395938 / 大客户专线:18574395938