Lazy loading a div using jquery

Hello, I’m trying to lazy load genius’ lyrics of a song at the end of my post. I discovered that jquery allows you to do that but my code isn’t working. What am I doing wrong?

The page : https://soundsirius.digitalpress.blog/golden-rule-trust/

<script type="text/javascript" src=" //cdn.jsdelivr.net/gh/eisbehr-/jquery.lazy@1.7.10/jquery.lazy.min.js "></script>

<script type="text/javascript" src=" //cdn.jsdelivr.net/gh/eisbehr-/jquery.lazy@1.7.10/jquery.lazy.plugins.min.js "></script>

<script>

$(function() {

$("div.rg_embed_link").lazyload({

effect : "fadeIn"

});

});

</script>

Hey @NicolasK, could you direct us to the section you’re trying to lazy load? I couldn’t find the element you’re trying to target with your script.

Hey, I decided to remove it. Couldn’t get the lazy loading to work and genius’ lyrics impact on my score in pagespeed was not understandable (68 without genius and 30 with genius). Now I copy/paste lyrics instead of embedding. But I guess I learned a lot about lazy loading even though I couldn’t get this code to work.

1 Like

I discovered my theme uses lozad so in the end all I had to do was write “lozad” in the class definition. I don’t if it’s my theme or ghost by default though.

1 Like