Large

Youtube - Better Watch Page

By Takato Last update Feb 28, 2014 — Installed 151,157 times.

Scrollable related videos

in
Subscribe to Scrollable related videos 14 posts, 6 voices



REVerdi Scriptwright
FirefoxWindows

Please give us a script just to put related videos in a scrollable list. I only wish this change in Youtube. Thanks in advance.

 
jackabood Scriptwright
FirefoxWindows

me too i want that

 
jackabood Scriptwright
FirefoxWindows

i'm treing to do it my self but it's to hard

 
Mainline421 Scriptwright
FirefoxWindows

jackabood wrote:
i'm treing to do it my self but it's to hard
Maby that's because you don't know JavaScript I will take that part of BWP's code if it is all right with takato

 
Takato Script's Author
FirefoxWindows

If you're using Firefox, download Stylish. It is an extension to apply CSS (styles), and you should use that when there is no Javascript needed.

Then go "Write New Style" and replace the contents with this:

@-moz-document domain("youtube.com") {
#watch-related-container {max-height:500px !important; overflow:auto !important; }
}

Then give it a name (such as "Scrollable Related Videos" and hit 'save'. Done! :)

 
whatup200 User
FirefoxWindows

wow omg thanks jackabood your the best

i diddn't want instal stylish

 
REVerdi Scriptwright
FirefoxWindows

Wow! Extra thanks Takato! Works perfectly!

 
REVerdi Scriptwright
FirefoxWindows

There is a small problem: the image of the videos further down is not displayed. This problem does not occur with Better Watch Page. Why? I think the style has to be applied after the page has fully loaded, is not it?

 
jackabood Scriptwright
FirefoxWindows

@EVerdi

hey dude no need to instal stylish

just add this line in a blank script


GM_addStyle(" #watch-related-container {max-height:600px !important; overflow:auto !important; } ");

<
just like that it will work and you won't have to insatl stylish

 
Takato Script's Author
FirefoxWindows

Ah, yeah Youtube doesn't load the thumbnails until you scroll to that bit of the page, but because its in a list it doesn't do it. You'll need to add this after jackabood's line:

suggestThumbs = document.getElementById("watch-sidebar").getElementsByClassName("video-thumb");
var count = 0;
while (count < suggestThumbs.length) {
	if (suggestThumbs[count].getAttribute("class").indexOf("-110") > -1) {
		img = suggestThumbs[count].getElementsByTagName("img")[0];
		imgPath = img.getAttribute("data-thumb");
		if (imgPath != undefined) {
			img.setAttribute("src", imgPath);
		}
	}
	count++;
}

 
jackabood Scriptwright
FirefoxWindows

thanks takato

i more thing

should add this line to make it look like in the bwp script


GM_addStyle( " .yt-vertical-rule-main , .yt-vertical-rule-corner-top , .yt-vertical-rule-corner-bottom {width: 1px } .yt-vertical-rule-main , .yt-vertical-rule-corner-top , .yt-vertical-rule-corner-bottom {background: #d5d5d5 !important;}"); 


and sorry that i used your line b4 in ysfix topic  i had it for a long time ago

 
REVerdi Scriptwright
FirefoxWindows

Thank you guys! Now it's perfect!

 
hellraven Scriptwright
FirefoxX11

the code for suggested thumbnails from takato seems not to be working...

never mind... found the error in the code.. suppose to be 'indexOf("-120")' ... not of -110

 
Mainline421 Scriptwright
FirefoxWindows

Takato wrote:
If you're using Firefox, download Stylish. It is an extension to apply CSS (styles), and you should use that when there is no Javascript needed.
Then go "Write New Style" and replace the contents with this:

@-moz-document domain("youtube.com") {
#watch-related-container {max-height:500px !important; overflow:auto !important; }
}

Then give it a name (such as "Scrollable Related Videos" and hit 'save'. Done! :)
Since this topics is already bumped what is wrong with javascript? I do the exact oposit and use Javascript when CSS is not needed.