diff --git a/src/js/html5.js b/src/js/html5.js
index e538e922..b03e9c26 100644
--- a/src/js/html5.js
+++ b/src/js/html5.js
@@ -44,8 +44,10 @@ const html5 = {
const player = this;
- // Set aspect ratio if set
- setAspectRatio.call(player);
+ // Set aspect ratio if fixed
+ if (!is.empty(this.config.ratio)) {
+ setAspectRatio.call(player);
+ }
// Quality
Object.defineProperty(player.media, 'quality', {
diff --git a/src/js/listeners.js b/src/js/listeners.js
index fe8d7d3c..c5076ff3 100644
--- a/src/js/listeners.js
+++ b/src/js/listeners.js
@@ -336,8 +336,13 @@ class Listeners {
on.call(player, elements.container, 'enterfullscreen exitfullscreen', event => {
const { target, usingNative } = player.fullscreen;
- // Ignore for iOS native
- if (!player.isEmbed || target !== elements.container) {
+ // Ignore events not from target
+ if (target !== elements.container) {
+ return;
+ }
+
+ // If it's not an embed and no ratio specified
+ if (!player.isEmbed && is.empty(player.config.ratio)) {
return;
}
diff --git a/src/js/utils/elements.js b/src/js/utils/elements.js
index 98b44f13..4f10938e 100644
--- a/src/js/utils/elements.js
+++ b/src/js/utils/elements.js
@@ -192,11 +192,8 @@ export function toggleHidden(element, hidden) {
hide = !element.hidden;
}
- if (hide) {
- element.setAttribute('hidden', '');
- } else {
- element.removeAttribute('hidden');
- }
+ // eslint-disable-next-line no-param-reassign
+ element.hidden = hide;
}
// Mirror Element.classList.toggle, with IE compatibility for "force" argument
diff --git a/src/js/utils/style.js b/src/js/utils/style.js
index 6f3069c9..941db8f2 100644
--- a/src/js/utils/style.js
+++ b/src/js/utils/style.js
@@ -27,15 +27,8 @@ export function reduceAspectRatio(ratio) {
}
export function getAspectRatio(input) {
- const parse = ratio => {
- if (!validateRatio(ratio)) {
- return null;
- }
-
- return ratio.split(':').map(Number);
- };
-
- // Provided ratio
+ const parse = ratio => (validateRatio(ratio) ? ratio.split(':').map(Number) : null);
+ // Try provided ratio
let ratio = parse(input);
// Get from config
diff --git a/src/sass/lib/mixins.scss b/src/sass/lib/mixins.scss
index 554c66a5..5a1ca753 100644
--- a/src/sass/lib/mixins.scss
+++ b/src/sass/lib/mixins.scss
@@ -62,12 +62,13 @@
.plyr__video-wrapper {
height: 100%;
- width: 100%;
+ position: static;
}
// Vimeo requires some different styling
&.plyr--vimeo .plyr__video-wrapper {
height: 0;
+ position: relative;
top: 50%;
transform: translateY(-50%);
}