3.7.0

What's Changed

With this release, you can now add more attributes to the tags generated by the Defer.css or Defer.js methods.

For example:

This will load the animate.css library lazily.

<script>
  var origin = 'https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1';

  Defer.css(origin + '/animate.min.css', {media: 'screen'}, 0, function () {
    console.info('Animate.css is loaded.'); // debug

    // adds animation classes to demo blocks.
    Defer.dom('.demo', 100, 'animate__animated animate__fadeIn');
  });
</script>

By adding {media: 'screen'}, the animate.css library will only load when the page is displayed on a screen-based device. The generated tag will look like:

<link media="screen" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" rel="stylesheet">