diff --git a/index.html b/index.html
index cb6279d..ba7eef3 100644
--- a/index.html
+++ b/index.html
@@ -61,6 +61,11 @@
data-title="Custom title" data-thumbnail="https://placekitten.com/500/281">
+
Youtube video with custom thumbnail quality
+
+
+
Vimeo video with thumbnail and title from API
diff --git a/src/lazyframe.js b/src/lazyframe.js
index 21a9ee1..2dadc89 100644
--- a/src/lazyframe.js
+++ b/src/lazyframe.js
@@ -11,6 +11,7 @@ const Lazyframe = () => {
id: undefined,
src: undefined,
thumbnail: undefined,
+ thumbnailquality: 'hq',
title: undefined,
initialized: false,
y: undefined,
@@ -155,7 +156,10 @@ const Lazyframe = () => {
_l.settings.title = constants.response.title(response);
}
if (!_l.settings.thumbnail) {
- const url = constants.response.thumbnail(response);
+ let url = constants.response.thumbnail(response);
+ if (_l.settings.thumbnailquality !== 'hq') {
+ url = url.replace('/hqdefault.jpg', `/${_l.settings.thumbnailquality}default.jpg`);
+ }
_l.settings.thumbnail = url;
lazyframe.settings.onThumbnailLoad.call(this, url);
}
@@ -297,7 +301,7 @@ const Lazyframe = () => {
iframeNode.setAttribute('src', settings.src);
iframeNode.setAttribute('frameborder', 0);
iframeNode.setAttribute('allowfullscreen', '');
-
+
if (settings.autoplay) {
iframeNode.allow = 'accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture';
}