Youtube website Scrolling issue

[shasen1235]

This is css injection not Javascript that Tampermonkey expects.

But it should work by defining the CSS injection process as a function then apply it.

I did not test this with Tampermonkey(as it's not free for Safari), but the following should work, as it works on UserScript:

// ==UserScript==
// @name        FixYouTubeScrolling
// @description Stop improper styling, Google
// @match       *://*youtube.*
// ==/UserScript==
const addGlobalStyle = (css) => {
    let head, style
    head = document.getElementsByTagName('head')[0]
    if (!head) { return }
    style = document.createElement('style')
    style.type = 'text/css'
    style.innerHTML = css
    head.appendChild(style)
}

addGlobalStyle('ytd-page-manager { overflow-y: unset !important; }')
addGlobalStyle('#page-manager.ytd-app { overflow-x: unset !important; }')

God! Thank you it works
However, I need to do a bit of edit on @match in order to detect youtube properly for Tampermonkey.

from
// @match *://*youtube.*
to
// @match *://*.youtube.com/*

Now no more sticky scrolling

 

[Wando64]

I found a workaround for this. Looks like google mess around with styling that made Safari unhappy.

Install Userscripts extension, add a new CSS with following content:

// ==UserScript==
// @name        FixYouTubeScrolling
// @description Stop improper styling, Google
// @match       *://*youtube.*
// ==/UserScript==
ytd-page-manager {
  overflow-y: unset !important;
}

#page-manager.ytd-app {
  overflow-x: unset !important;
}

Sample:

Save and refresh YouTube, you should now have Apple-like butter smooth scrolling.

@Gnattu, you are a credit to this community.
Thank you.

 

[djlythium]

UPDATE: Big Sur 11.1 fixed this for me.

 

[flowsy]

11.1 didn't fix it for me unfortunately, but this workaround did. Thanks Gnattu!

 

[shasen1235]

For proper official fix we need to wait for Safari build 14.1.
The current technical preview fixed this issue on some big sites like Youtube, twitter...etc.
But still, there are still some sites having the same issue haven't been fixed.

 

[Andrewfeng]

I found a workaround for this. Looks like google mess around with styling that made Safari unhappy.

Install Userscripts extension, add a new CSS with following content:

// ==UserScript==
// @name        FixYouTubeScrolling
// @description Stop improper styling, Google
// @match       *://*youtube.*
// ==/UserScript==
ytd-page-manager {
  overflow-y: unset !important;
}

#page-manager.ytd-app {
  overflow-x: unset !important;
}

Sample:

Save and refresh YouTube, you should now have Apple-like butter smooth scrolling.

Hi, I'm having the same issue and this code has solved the problem perfectly. It now even automatically offers small window playing. Thank you very much!

 

[barmann]

This is css injection not Javascript that Tampermonkey expects.

But it should work by defining the CSS injection process as a function then apply it.

I did not test this with Tampermonkey(as it's not free for Safari), but the following should work, as it works on UserScript:

// ==UserScript==
// @name        FixYouTubeScrolling
// @description Stop improper styling, Google
// @match       *://*youtube.*
// ==/UserScript==
const addGlobalStyle = (css) => {
    let head, style
    head = document.getElementsByTagName('head')[0]
    if (!head) { return }
    style = document.createElement('style')
    style.type = 'text/css'
    style.innerHTML = css
    head.appendChild(style)
}

addGlobalStyle('ytd-page-manager { overflow-y: unset !important; }')
addGlobalStyle('#page-manager.ytd-app { overflow-x: unset !important; }')

Thank you so much, this fixed a very annoying Youtube bug, where I would get double side scroll bars with most YT videos , and the above mentioned scrolling issues .

This is in High Sierra , Safari 13.1.2 .
The issue started a few weeks ago, and so far has been limited to Youtube .

 

[me55]

Scrolling often jitters and hangs, also video playback often stutters when using Safari 14.0.2. YouTube works flawlessly with the Safari Technoloy Preview Release 117.

 

[flvmeed]

I found a workaround for this. Looks like google mess around with styling that made Safari unhappy.

Install Userscripts extension, add a new CSS with following content:

// ==UserScript==
// @name        FixYouTubeScrolling
// @description Stop improper styling, Google
// @match       *://*youtube.*
// ==/UserScript==
ytd-page-manager {
  overflow-y: unset !important;
}

#page-manager.ytd-app {
  overflow-x: unset !important;
}

Sample:

Save and refresh YouTube, you should now have Apple-like butter smooth scrolling.

thank you so much, worked for me

 

[lewdvig]

Thanks @Gnattu !!!

 

[hpkhpkhpk]

I had the same issue only on Youtube starting with Big Sur and found that the following fixed it immediately:

In Safari open the Develop menu (maybe you have to enable the Develop menu first via Safari - Preferences - Advanced - Show Develop menu in the menu bar) and click Empty Caches.

Open the Develop menu once more, go to Experimental Features and scroll to the very bottom. Click Reset All to Defaults.

 

[paddylaz]

Don't want to tempt fate but it APPEARS to have been fixed in 11.2

 

[dimon2242]

Don't want to tempt fate but it APPEARS to have been fixed in 11.2

No, isn't fixed.

 

[me55]

Fixed here with 11.2, Safari 14.0.3 (16610.4.3.1.4).

 

[flowsy]

It's even better in macOS Big Sur beta 11.3. Safari Version 14.1 (16611.1.10.1.5). And I mean all around better, just like in the Technology Preview.

 

[vetoes]

Scrolling works fine on all pages other than on stupid Reddit and Instagram/explore subpage.

 

[shasen1235]

So far the best macOS version is 10.15.3 IMO.

Bundled with Safari 13 and good old trackpad scrolling algorithm.

Everything is buttery smooth as it should be.

Thanks Apple&Google, for ruining everything

 

[kakaku]

I have this issue as well

Safari also sometimes hangs while opening a new tab, I only have 7-8 tabs open - on 8GB M1 MBA

twitter lags a lot also in the m1 mba base model right?