Tag: lazy loading

Jquery – 使用延迟加载加载非常慢的MapTiles: 而我的下一个问题。我做了一个小地图，显示了一些观点。我认为将地图分成200x200px的瓷砖以便于加载是个好主意。但是对于每个缩放级别，地图拖动变得更慢。我想我在算法中犯了一个逻辑错误。算法是： function LazyLoad(img) { //Viewport data var top = m.viewingBox.offset().top; var left = m.viewingBox.offset().left; var right = m.viewingBox.offset().left + m.viewingBox.width(); var bot = m.viewingBox.offset().top + m.viewingBox.height(); //Image data var imgT = img.offset().top; var imgL = img.offset().left; var imgR = img.offset().left + img.width(); var imgB = img.offset().top + img.height(); //check if […]

用户向下滚动页面时从数据库延迟加载（类似于Twitter和Facebook）: 我有优惠券代码网站。在某些类别页面上，我限制它只显示50张优惠券，因为每个类别可能有1000张优惠券。我不会全部显示它们，因为它在服务器上会很难，浏览器会挂起。当用户不断向下滚动时，是否可能延迟加载更多优惠券？我发现的唯一延迟加载插件是图像。那些可以与PHP一起工作并从MySQL数据库加载数据的东西？任何帮助表示赞赏。谢谢！

jQuery：使用carouFredSel插件延迟加载: 我正在尝试为使用carouFredSel jQuery插件创建的轮播内的图像实现延迟加载。你有任何建议或者你已经取得了类似的成就吗？它似乎默认不能这样做。

在水平滑块中延迟加载图像: 我懒得用jquery lazyload和一个阈值加载这个站点上的图像： https ： //bm-translations.de/#leistungen //Lazyload Images with Threshold https://www.appelsiini.net/projects/lazyload $(function() { $(“img.lazy”).lazyload({ threshold : 400 }); }); 所以Images src被data-original取代。当我滚动到元素时，它应该将其更改为src ，就像它一样。但出于某种原因，它加载引导滑块中的图像太慢（当我点击它或它的自动滑动一些图像没有加载），你可以看到。如何调整此代码，以便它也适用于此？滑块的结构如下： https ： //www.w3schools.com/bootstrap/bootstrap_carousel.asp Carousel JS是： $(‘#myCarousel’).carousel({ interval: 9000, }); // handles the carousel buttons $(‘[id^=carousel-selector-]’).click( function(){ var id_selector = $(this).attr(“id”); var id = id_selector.substr(id_selector.length -1); id = parseInt(id); […]

如何在缓存中加载iframe并考虑缓存: 我之前用过这种方法。在使用javascript的事件中，我将data-src为src并且video开始播放。我在浏览器中返回时遇到了浏览器缓存问题，背景中的video自动播放（我为实际的iframe加载了缩略图）。因此，我切换到一种方法，我只是在评论中加载iframe <!—-> 然后删除点击评论。我在Google plus上看到谷歌使用这种确切的方法。问题是现在再次缓存，这次是服务器端。我认为cloudflairs自动缩小很可能正在删除HTML评论。快速搜索显示我可能无法标记他们不会使用cloudfliar删除的评论。最重要的是，这是一个wordpress插件，所以问题仍然与删除HTML注释的各种缓存插件相关。所以现在我的问题是。是否有更好的方法延迟加载没有HTML注释的iframe？我还是想以某种方式将iframe存储到位…就像我写这篇文章一样，我可能能够存储数据以构建一个iframe，在一些随机标签json编码或其他东西，然后在点击时构建iframe。

延迟加载插件和Jscroll不能一起工作，图像没有加载: 我使用了jscroll插件，并在我的应用程序中使用了延迟加载插件。现在滚动我的内容是正确加载和替换，但我的图像没有加载。看我的代码： – $(‘#product-grid’).jscroll({ debug: true, autoTriggerUntil: 2, nextSelector: ‘.pager a:last’, contentSelector: ‘.product-grid’, callback:call() }); function call() { alert(“hi”); $(“img.lazy”).lazyload(); } 现在在上面的代码中看到我使用了一个回调函数但是在所有滚动后它都没有调用。为什么？谁能帮我？我也有另一个问题。我设置了autoTriggerUntil：2，但在2次触发后没有任何下一个链接，所以我该如何解决这个问题。请回复我需要帮助问候，vinit

如何在包含500多张图像的页面上实现延迟加载？: 我基本上有一个预订引擎单位结果页面，必须显示40个单位，每个单位有1个大图像的第一个缩略图和X个随附的缩略图图像。我一直在使用jquery延迟加载插件，但它不够彻底（我在DOM Ready上调用它），而且它在IE中不起作用（50％的客户端使用IE因此这是一个大问题）。我认为我真正需要做的并不是真的吐出图像而是伪造的元素，例如跨度，并且可能修改我的代码，这样如果用户查看跨度，则将其渲染为图像元素。预订引擎依赖于JS，所以我想我可能只是依赖于ajaxifying所有缩略图并在窗口滚动等事件处理程序，以使页面“可用”并平均加载（2-3在高速DSL /电缆上使用秒而不是5到30秒。我很欣赏任何例子或想法。相关链接/发现可能有助于解决此问题：＃1 ： http ： //github.com/silentmatt/jquery_lazyload jquery延迟加载的一个分支似乎解决了IE加载并增加了对容器的支持。＃2 ：youtube.com将一些video的src设置为1×1透明gif和延迟加载后大约前10个结果左右。更新＃1 ：我们决定制作一个脚本来生成缩略图并对它们进行递归生成。我实现了它们。 570个缩略图图像中的每一个都是60-120KB，而现在它们只有2 KB。由于570个并发请求，加载速度稍快但仍然很慢，即使延迟加载器插件到位，我也不确定它是否足够快地应用（即使在图像完全加载之前就准备好了DOM）。虽然取得了一些进展。我想在前10个单元之后生成1×1像素的GIF并且只是延迟加载它们。仍然需要研究一种技术。

如何在firefox中处理“图像损坏或截断”: 插入我正在使用一个名为lazyload的jQuery插件。这样做的是lazy加载图像 – 这意味着它不会在浏览器中呈现它们，直到图像在视口范围内。例如，当您拥有包含许多图像的页面时，这非常有用，并且您不希望它在初始加载时永远消耗。 FIREFOX 好的，所以我也使用Firefox版本23.0.1 问题插件很棒，但是当在一些图像之后向下滚动时，我开始得到图像无法加载的错误（只有一个通用的占位符用于损坏的图像链接），并在控制台中记录： Image corrupt or truncated: [image url] 并不是图像有问题。它们都可以单独渲染。它不是SPECIFIC图像，因为它是随机的。如果我再次加载页面，现在可能会加载corrupt的图像，其他图像返回断开的链接并在控制台中记录corrupt 。我四处寻找这个，似乎同时提取 src标签存在一些问题。可能应该在获取时设置延迟，但是你不能总是知道延迟应该有多长。如果一个图像比另一个图像大，它仍然可能会发生冲突（静态延迟时间，而不是complete回调）。因此，我想要求： a）如果有人知道解决方案（例如在发生错误时捕获并重新触发加载图像function） b）如果任何人可以向上面的库（lazyload）提出$.extend() ，它将创建一个回调函数并等到所有活动的提取complete后再加载下一个（如果这是问题 – 我不确定是否它是）我不是一个jQuery忍者所以我在代码上有点迷失。我可以搞清楚，但它可能很脏…… c）如果这不是问题，那么我可以理解如何解决这个问题

搜索延迟加载jQuery幻灯片或：黑客交叉幻灯片: 我试图获得一个jquery幻灯片来显示来自flickr，淡入淡出和滚动的图像。一切正常，除了我真的需要延迟加载图像（只需按需加载图像）。我目前正在使用jquery.cross-slide（ http://tobia.github.com/CrossSlide/ ），但不幸的是，tobia不再使用该插件，也不想回答问题。我找到了jquery.cycle的一个例子，其中应用了图像延迟加载（请参阅http://malsup.com/jquery/cycle/add3.html ）是否有任何机会将此function侵入交叉幻灯片的来源或者是由于插件的架构，这是不可能的？请参阅此处的代码： https ： //github.com/tobia/CrossSlide/blob/master/jquery.cross-slide.js#L131

用javascript（lazyload）停止加载图像？: 我试图在dom准备就绪时停止使用javascript加载图像，然后在我想要的时候初始化加载，即所谓的延迟加载图像。像这样的东西： $(document).ready(function () { var images = $(‘img’); $.each(images, function() { $(this).attr(‘src’, ”); }); }); 这不起作用（在ff3.5，safari 3-4中测试）。无论如何，图像正在加载，我不明白。例如，这个插件www.appelsiini.net/projects/lazyload正在执行完全相同的操作，删除页面加载时的src属性。我错过了什么？编辑：我在这里添加了一个测试页面： http ： //dev.bolmaster2.com/dev/lazyload-test/我首先完全删除src属性，然后在5秒后我将其与原始图像一起添加。仍然不起作用，至少萤火虫说图像在开始时加载，是不是信任萤火虫？