NOTICE: By continued use of this site you understand and agree to the binding Terms of Service and Privacy Policy.
// ==UserScript== // @name Floating youtube player // @namespace https://www.youtube.com/ // @version 1.0 // @license MIT // @description Make youtube player float // @author pcktm // @icon https://youtube.com/favicon.ico // @match https://www.youtube.com/watch?v=* // @grant none // @require https://code.jquery.com/jquery-3.3.1.slim.min.js // ==/UserScript== (function () { 'use strict'; console.log('Floating youtube init'); })(); let state = { bool: 1 }; let element = $('video') $(window).scroll(function () { if ($('.title').visible()) { if (state.bool == 0) { element.attr('style', state.initStyle); state.bool = 1; } } else { if (state.bool == 1) { state.initStyle = element.attr("style") var size = { width: state.initStyle.split(';')[0].split(' ')[1].slice(0, -2), height: state.initStyle.split(';')[1].split(' ')[2].slice(0, -2) } size.calc = calculateAspectRatioFit(size.width, size.height, $(window).width() / 3, $(window).width() / 3) element.attr('style', ''); element.css({ 'position': 'fixed', 'left': $(window).width() - $(window).width() / 30 - size.calc.width + 'px', 'top': $(window).height() - $(window).height() / 30 - size.calc.height + 'px', 'width': size.calc.width, 'height': size.calc.height }) state.bool = 0; } } }) function calculateAspectRatioFit(srcWidth, srcHeight, maxWidth, maxHeight) { var ratio = Math.min(maxWidth / srcWidth, maxHeight / srcHeight); return { width: srcWidth * ratio, height: srcHeight * ratio }; } //EXTERNAL JQUERY PLUGIN THAT GREASESCRIPT DIDN'T LET ME LOAD (JQUERY VISIBLE) ! function (t) { var i = t(window); t.fn.visible = function (t, e, o) { if (!(this.length < 1)) { var r = this.length > 1 ? this.eq(0) : this, n = r.get(0), f = i.width(), h = i.height(), o = o ? o : "both", l = e === !0 ? n.offsetWidth * n.offsetHeight : !0; if ("function" == typeof n.getBoundingClientRect) { var g = n.getBoundingClientRect(), u = g.top >= 0 && g.top < h, s = g.bottom > 0 && g.bottom <= h, c = g.left >= 0 && g.left < f, a = g.right > 0 && g.right <= f, v = t ? u || s : u && s, b = t ? c || a : c && a; if ("both" === o) return l && v && b; if ("vertical" === o) return l && v; if ("horizontal" === o) return l && b } else { var d = i.scrollTop(), p = d + h, w = i.scrollLeft(), m = w + f, y = r.offset(), z = y.top, B = z + r.height(), C = y.left, R = C + r.width(), j = t === !0 ? B : z, q = t === !0 ? z : B, H = t === !0 ? R : C, L = t === !0 ? C : R; if ("both" === o) return !!l && p >= q && j >= d && m >= L && H >= w; if ("vertical" === o) return !!l && p >= q && j >= d; if ("horizontal" === o) return !!l && m >= L && H >= w } } } }(jQuery);