Suppression de la librairie lozad puisque les navigateurs font maintenant du lazy loading

This commit is contained in:
Simon 2022-09-13 23:27:16 +02:00
parent 5fac28ae1d
commit 9b9ceaea16
15 changed files with 14 additions and 32 deletions

View File

@ -32,7 +32,6 @@ params:
- link: plugins/slick/slick.min.js
- link: plugins/shuffle/shuffle.min.js
- link: plugins/magnific-popup/jquery.magnific-popup.min.js
- link: plugins/lazy-load/lozad.min.js
# - link: plugins/google-map/map.js
logo: images/jarnat-logo.svg

View File

@ -121,7 +121,6 @@ share those images.
- [Bootstrap](https://getbootstrap.com/docs/4.3/getting-started/introduction/)
- [Jquery](https://jquery.com/download/)
- [Themify Icons](https://themify.me/themify-icons)
- [Lozad](https://apoorv.pro/lozad.js/)
- [Magnific Popup](https://dimsemenov.com/plugins/magnific-popup/)
- [Slick Slider](https://kenwheeler.github.io/slick/)
- [Shuffle](https://vestride.github.io/Shuffle/)

View File

@ -9,13 +9,6 @@ $(window).on('load', function () {
jQuery(function ($) {
"use strict";
/* ========================================================================= */
/* lazy load initialize
/* ========================================================================= */
const observer = lozad(); // lazy loads elements with default selector as ".lozad"
observer.observe();
/* ========================================================================= */
/* Magnific popup
/* ========================================================================= */

View File

@ -1,7 +1,7 @@
<article class="col-lg-4 col-md-6 col-12 clearfix wow fadeInUp mb-4" data-wow-duration="500ms">
<div class="post-block">
<div class="media-wrapper">
<img class="img-fluid lozad" data-src="{{ .Params.Image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .Params.image | absURL }}'">
<img class="img-fluid" src="{{ .Params.Image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .Params.image | absURL }}'" loading="lazy">
</div>
<div class="content">

View File

@ -16,7 +16,7 @@
{{ end }}
</ul>
{{ if .Params.Image }}
<img class="img-fluid mb-50 lozad" data-src="{{ .Params.Image | absURL }}" alt="blog-image">
<img class="img-fluid mb-50" src="{{ .Params.Image | absURL }}" alt="blog-image" loading="lazy">
{{ end }}
</div>
<div class="col-lg-8 offset-lg-2">

View File

@ -14,10 +14,10 @@
<div class="content text-center">
<figure>
{{ if .Params.Image }}
<img class="rounded-circle img-fluid lozad" data-src="{{.Params.Image | relURL }}">
<img class="rounded-circle img-fluid" src="{{.Params.Image | relURL }}" loading="lazy">
{{else if .Params.Email}}
<img class="rounded-circle img-fluid lozad"
data-src="https://www.gravatar.com/avatar/{{ md5 .Params.email }}?s=128&pg&d=identicon">
<img class="rounded-circle img-fluid"
src="https://www.gravatar.com/avatar/{{ md5 .Params.email }}?s=128&pg&d=identicon" loading="lazy">
{{ end }}
<figcaption>
<h5 class="font-weight-bold">

View File

@ -5,7 +5,7 @@
{{"<!-- Welcome Slider-->" | safeHTML}}
<section class="hero-area" style='background-image: url("{{ .bg_image_webp | absURL }}")'>
<!-- this image is for trigger this section fallback background image -->
<img class="d-none" src="{{ .bg_image_webp | absURL }}" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'"/>
<img class="d-none" src="{{ .bg_image_webp | absURL }}" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" loading="lazy"/>
<div class="block p-6">
{{ if .icon }}

View File

@ -8,7 +8,7 @@
<div class="row justify-content-center align-items-center">
<div class="col-12 col-md-2 m-md-0 m-5 m-md-3" style="height: 150px; background-image: url('{{ .image_webp | absURL }}'); background-size: contain; background-position: center; background-repeat: no-repeat; ">
<!-- this image is for trigger this section fallback background image -->
<img src="{{ .image_webp | absURL }}" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .image | absURL }})'">
<img src="{{ .image_webp | absURL }}" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .image | absURL }})'" loading="lazy">
</div>
<div class="col-12 col-md-9">
<div class="content-block">

View File

@ -18,11 +18,11 @@
{{"<!-- copyright -->" | safeHTML}}
<div class="copyright text-center">
<a href="{{ site.Home.Permalink }}">
<img src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}" height="42" />
<img src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}" height="42" loading="lazy" />
</a>
<br>
<p>{{ site.Params.copyright | markdownify }}</p>
<img src="/images/sponsors.jpg" alt="Sponsors : Nouvelle Aquitaine - UE" height="100" />
<img src="/images/sponsors.jpg" alt="Sponsors : Nouvelle Aquitaine - UE" height="100" loading="lazy" />
</div>
</div>
</div>

View File

@ -5,7 +5,7 @@
{{"<!-- Start Counter Section -->" | safeHTML}}
<section id="counter" class="parallax-section bg-1 section overly" style='background-image: url("{{ .bg_image_webp | absURL }}")'>
<!-- this image is for trigger this section fallback background image -->
<img class="lozad" style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" data-src="{{ .bg_image_webp | absURL }}" />
<img style="display: none;" onerror="this.onerror=null;this.parentElement.style.backgroundImage= 'url({{ .bg_image | absURL }})'" src="{{ .bg_image_webp | absURL }}" loading="lazy" />
<div class="container">
<div class="row justify-content-center">
{{ range .counter_item }}

View File

@ -4,7 +4,7 @@
<nav class="navbar navbar-expand-sm navbar-dark">
<a class="navbar-brand p-0" href="{{ .Site.BaseURL | relLangURL }}">
{{ if site.Params.logo }}
<img class="lozad" data-src="{{ site.Params.logo | absURL }}" alt="{{ .Site.Title }}" height="42">
<img src="{{ site.Params.logo | absURL }}" alt="{{ .Site.Title }}" height="42" loading="lazy">
{{ else }}
{{ site.Title }}
{{ end }}

View File

@ -18,7 +18,7 @@
<div class="row">
{{ with .image }}
<div class="col-lg-6 p-3 text-center">
<img class="img-fluid lozad" data-src="{{ . | absURL }}" alt="image">
<img class="img-fluid" src="{{ . | absURL }}" alt="image" loading="lazy">
</div>
{{ end }}
<div class="col-lg-{{ with .image }}6{{else}}12{{ end }} p-3">

View File

@ -22,7 +22,7 @@
<div class="team-member">
<div class="member-photo">
{{"<!-- member photo -->" | safeHTML}}
<img class="img-fluid lozad" data-src="{{ .image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .image | absURL }}'" alt="{{ .name }}">
<img class="img-fluid" src="{{ .image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .image | absURL }}'" alt="{{ .name }}" loading="lazy">
{{"<!-- member social profile -->" | safeHTML}}
<div class="mask">

View File

@ -18,7 +18,7 @@
{{"<!-- client photo -->" | safeHTML}}
<div class="client-thumb">
<img class="img-fluid lozad" data-src="{{ .image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .image | absURL }}'" alt="{{ .name }}">
<img class="img-fluid" src="{{ .image_webp | absURL }}" onerror="this.onerror=null;this.src='{{ .image | absURL }}'" alt="{{ .name }}" loading="lazy">
</div>
{{"<!-- client info -->" | safeHTML}}

View File

@ -1,9 +0,0 @@
/*! lozad.js - v1.9.0 - 2019-02-09
* https://github.com/ApoorvSaxena/lozad.js
* Copyright (c) 2019 Apoorv Saxena; Licensed MIT */
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.lozad=e()}(this,function(){"use strict";var g=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(t[o]=r[o])}return t},n="undefined"!=typeof document&&document.documentMode,l={rootMargin:"0px",threshold:0,load:function(t){if("picture"===t.nodeName.toLowerCase()){var e=document.createElement("img");n&&t.getAttribute("data-iesrc")&&(e.src=t.getAttribute("data-iesrc")),t.getAttribute("data-alt")&&(e.alt=t.getAttribute("data-alt")),t.appendChild(e)}if("video"===t.nodeName.toLowerCase()&&!t.getAttribute("data-src")&&t.children){for(var r=t.children,o=void 0,a=0;a<=r.length-1;a++)(o=r[a].getAttribute("data-src"))&&(r[a].src=o);t.load()}t.getAttribute("data-src")&&(t.src=t.getAttribute("data-src")),t.getAttribute("data-srcset")&&t.setAttribute("srcset",t.getAttribute("data-srcset")),t.getAttribute("data-background-image")&&(t.style.backgroundImage="url('"+t.getAttribute("data-background-image")+"')"),t.getAttribute("data-toggle-class")&&t.classList.toggle(t.getAttribute("data-toggle-class"))},loaded:function(){}};
/**
* Detect IE browser
* @const {boolean}
* @private
*/function f(t){t.setAttribute("data-loaded",!0)}var b=function(t){return"true"===t.getAttribute("data-loaded")};return function(){var r,o,a=0<arguments.length&&void 0!==arguments[0]?arguments[0]:".lozad",t=1<arguments.length&&void 0!==arguments[1]?arguments[1]:{},e=g({},l,t),n=e.root,i=e.rootMargin,d=e.threshold,c=e.load,u=e.loaded,s=void 0;return window.IntersectionObserver&&(s=new IntersectionObserver((r=c,o=u,function(t,e){t.forEach(function(t){(0<t.intersectionRatio||t.isIntersecting)&&(e.unobserve(t.target),b(t.target)||(r(t.target),f(t.target),o(t.target)))})}),{root:n,rootMargin:i,threshold:d})),{observe:function(){for(var t=function(t){var e=1<arguments.length&&void 0!==arguments[1]?arguments[1]:document;return t instanceof Element?[t]:t instanceof NodeList?t:e.querySelectorAll(t)}(a,n),e=0;e<t.length;e++)b(t[e])||(s?s.observe(t[e]):(c(t[e]),f(t[e]),u(t[e])))},triggerLoad:function(t){b(t)||(c(t),f(t),u(t))},observer:s}}});