KayleyV2
(?)Community Member
- Posted: Sun, 28 Sep 2008 04:22:31 +0000
IF YOU ARE ASKING FOR HELP, IT WOULD BE USEFUL IF YOU MADE SURE YOUR PROFILE WAS PUBLIC. OTHERWISE WE CAN'T ASSIST YOU BECAUSE WE DON'T KNOW WHAT YOU'RE DOING OR WHAT COULD BE CAUSING THE PROBLEM.
(lolol capslock ftw)
HIDDEN SCROLLBARS
I see so many people trying to achieve this effect; most of the time they either don't get it at all or they do it in a way that messes a bunch of stuff on the page up (like when you try to scroll down the page it scrolls only that section). This guide will explain how to make your scrollbars not visible.
Example: comments section here...
http://www.gaiaonline.com/profiles/?u=5498755
Doing this involves the padding-right property. However, if you want to do it most efficiently, you need more than that.
This is kind of advanced coding I guess.
LIST OF SELECTORS AND THEIR COUNTERPARTS ON OLD SCHOOL/CLASSIC
key: selector + selector2
#comments + #comments dl
#about + #about ol or #about ul
#friends + #friendGroup
#wishlist + #wishlist .items
#journal + #entries
LIST OF SELECTORS AND THEIR COUNTERPARTS ON V2/CURRENTkey: selector + selector2
#id_comments + #id_comments dl
#id_about + #id_about ol or #id_about ul
#id_friends + #id_friends .style1
#id_journal + #entries
#id_badges + #badges
#id_custom_#### + #id_custom_#### ol or #id_custom_#### ul
(for custom sections, the #### at the end should actually be numbers. visit my other guide to learn about finding custom section selectors)
(for custom sections, you need list tags like you would with an #about ol or #about ul (explained below))
BASE CODE
This is a base code for a hidden scrollbar:
selector{overflow: auto; overflow-x: hidden; overflow-y: hidden; height: ##px;}
selector2{overflow-y: auto; padding-right: 500px; height: ##px; width: ##px;}
PARTS EXPLAINED
selector = the selector for the section, as specified above in the "SELECTORS AND THEIR COUNTERPARTS" section.
height/width = just add how high or wide you want that specific section to be. The second selector should be smaller than the first, because it is fitting inside of the first selector. You can see sample values in the example below.
selector2 = On the "SELECTORS AND THEIR COUNTERPARTS" list, these are the counterparts. So if you used #friends as your selector, you would use #friendGroup as selector2.
EXAMPLE CODE
Here is an example of it in use:
#id_comments{overflow: auto; overflow-x: hidden; overflow-y: hidden; height: 200px;}
#id_comments dl{overflow-y: auto; padding-right: 500px; height: 125px; width: 475px;}
This code is the exact code on the profile here.
ABOUT OL/UL
You do not automatically have an #about ol/#about ul or #id_about ol/#id_about ul. You have to format your about section a certain way to have one.
NOTE: I recommend using #about ol and #id_about ol, because the ul will affect the #about .links as well. However, if you choose ul, or need to use both, you can fix any problems by applying direct properties to #about .links that reverse any changes caused by #about ul.
For example, if your About looks like this:
Then everything in the [list=1][/list] codes is your #about ol or #id_about ol. If you want to make a hidden scrollbar like this guide explains, then your entire about should be in those list tags.
If your About looks like this:
Then everything in the [list][/list] codes is your #about ul or #id_about ul. If you want to make a hidden scrollbar like this guide explains, then your entire about should be in those list tags.
#about ul can be helpful if you have #about ol custom sections, but still want a hidden scrollbar about section. You can also use it by itself if you just like it better than ols.
CONCLUSION
Yeah. So this is my guide. It's kind of rushed because I have homework, but lots of people have been asking question, so hopefully I think this might help them.
Feel free to reply to this thread with questions or bumps (but only bump if the thread has fallen off the first page of the Profile Discussion forum). I will try to answer questions, although please don't be offended if I don't answer. My life can be hectic at times and I don't always have time to answer; it is nothing against you personally. I also don't respond to "thank you" posts usually, although I appreciate them greatly so feel free to post them if you enjoyed my guide. 3nodding
If you want to learn more about coding, you can visit my V2/Current profile coding guide:
(lolol capslock ftw)
HIDDEN SCROLLBARS
I see so many people trying to achieve this effect; most of the time they either don't get it at all or they do it in a way that messes a bunch of stuff on the page up (like when you try to scroll down the page it scrolls only that section). This guide will explain how to make your scrollbars not visible.
Example: comments section here...
http://www.gaiaonline.com/profiles/?u=5498755
Doing this involves the padding-right property. However, if you want to do it most efficiently, you need more than that.
This is kind of advanced coding I guess.
LIST OF SELECTORS AND THEIR COUNTERPARTS ON OLD SCHOOL/CLASSIC
key: selector + selector2
#comments + #comments dl
#about + #about ol or #about ul
#friends + #friendGroup
#wishlist + #wishlist .items
#journal + #entries
LIST OF SELECTORS AND THEIR COUNTERPARTS ON V2/CURRENTkey: selector + selector2
#id_comments + #id_comments dl
#id_about + #id_about ol or #id_about ul
#id_friends + #id_friends .style1
#id_journal + #entries
#id_badges + #badges
#id_custom_#### + #id_custom_#### ol or #id_custom_#### ul
(for custom sections, the #### at the end should actually be numbers. visit my other guide to learn about finding custom section selectors)
(for custom sections, you need list tags like you would with an #about ol or #about ul (explained below))
BASE CODE
This is a base code for a hidden scrollbar:
selector{overflow: auto; overflow-x: hidden; overflow-y: hidden; height: ##px;}
selector2{overflow-y: auto; padding-right: 500px; height: ##px; width: ##px;}
PARTS EXPLAINED
selector = the selector for the section, as specified above in the "SELECTORS AND THEIR COUNTERPARTS" section.
height/width = just add how high or wide you want that specific section to be. The second selector should be smaller than the first, because it is fitting inside of the first selector. You can see sample values in the example below.
selector2 = On the "SELECTORS AND THEIR COUNTERPARTS" list, these are the counterparts. So if you used #friends as your selector, you would use #friendGroup as selector2.
EXAMPLE CODE
Here is an example of it in use:
#id_comments{overflow: auto; overflow-x: hidden; overflow-y: hidden; height: 200px;}
#id_comments dl{overflow-y: auto; padding-right: 500px; height: 125px; width: 475px;}
This code is the exact code on the profile here.
ABOUT OL/UL
You do not automatically have an #about ol/#about ul or #id_about ol/#id_about ul. You have to format your about section a certain way to have one.
NOTE: I recommend using #about ol and #id_about ol, because the ul will affect the #about .links as well. However, if you choose ul, or need to use both, you can fix any problems by applying direct properties to #about .links that reverse any changes caused by #about ul.
For example, if your About looks like this:
[list=1]haha this is my about.
isn't that cooooool.
i'm me.
sup.[/list]
isn't that cooooool.
i'm me.
sup.[/list]
Then everything in the [list=1][/list] codes is your #about ol or #id_about ol. If you want to make a hidden scrollbar like this guide explains, then your entire about should be in those list tags.
If your About looks like this:
[list]haha this is my about.
isn't that cooooool.
i'm me.
sup.[/list]
isn't that cooooool.
i'm me.
sup.[/list]
Then everything in the [list][/list] codes is your #about ul or #id_about ul. If you want to make a hidden scrollbar like this guide explains, then your entire about should be in those list tags.
#about ul can be helpful if you have #about ol custom sections, but still want a hidden scrollbar about section. You can also use it by itself if you just like it better than ols.
CONCLUSION
Yeah. So this is my guide. It's kind of rushed because I have homework, but lots of people have been asking question, so hopefully I think this might help them.
Feel free to reply to this thread with questions or bumps (but only bump if the thread has fallen off the first page of the Profile Discussion forum). I will try to answer questions, although please don't be offended if I don't answer. My life can be hectic at times and I don't always have time to answer; it is nothing against you personally. I also don't respond to "thank you" posts usually, although I appreciate them greatly so feel free to post them if you enjoyed my guide. 3nodding
If you want to learn more about coding, you can visit my V2/Current profile coding guide:





