MelonLand Forum

World Wild Web => ✁ ∙ Web Crafting => ☔︎ ∙ I need Help! => Topic started by: Uneuclid on August 22, 2023 @147.08

Title: help: how to make a custom scroll bar
Post by: Uneuclid on August 22, 2023 @147.08

making a site, was wondering if its possible to make a custom scroll bar like here
https://web.archive.org/web/20070605180454/http://www.diseasedproductions.net/

ik you can customize the color, but i mean like replacing the area with custom images n stuff if that makes sense

Title: Re: help: how to make a custom scroll bar
Post by: rinni on August 22, 2023 @171.39

I'm not super knowledgeble on scrollbars, but i found the ones i use on https://scripted.neocities.org/ !, i even figured out how to tweak the code of one to make the back of the bar transparent.

but from what i understand, it's very similar to border images! you need an image for your bumpers/up-down buttons, an image for the actual bar itself, one that can stretch as needed, and one for the background of the bar. Usually the images are pretty small, from what i've seen! You can also place the css inside a div for the bar to only apply there, or outside of all divs so it applies to the entire page!

w3 schools has a tutorial on the subject: https://www.w3schools.com/howto/howto_css_custom_scrollbar.asp and so do many other sites! i've lately preferred css tricks: https://css-tricks.com/almanac/properties/s/scrollbar/ for css related questions

i hope this helps!!

Title: Re: help: how to make a custom scroll bar
Post by: Uneuclid on August 29, 2023 @740.12

Quote from: rinni on August 22, 2023 @171.39

I'm not super knowledgeble on scrollbars, but i found the ones i use on https://scripted.neocities.org/ !, i even figured out how to tweak the code of one to make the back of the bar transparent.

but from what i understand, it's very similar to border images! you need an image for your bumpers/up-down buttons, an image for the actual bar itself, one that can stretch as needed, and one for the background of the bar. Usually the images are pretty small, from what i've seen! You can also place the css inside a div for the bar to only apply there, or outside of all divs so it applies to the entire page!

w3 schools has a tutorial on the subject: https://www.w3schools.com/howto/howto_css_custom_scrollbar.asp and so do many other sites! i've lately preferred css tricks: https://css-tricks.com/almanac/properties/s/scrollbar/ for css related questions

i hope this helps!!

thank you ^_^