• When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!

    Remember to credit artists when using work not your own.

Help How do I make a hidden scroll? (Solved)

Arnalia

Member
Roleplay Availability
Roleplay Type(s)
OK, I know next to nothing about coding and BBC code so bear with my incompetence please. 🙇‍♀️ I want to make a simple mobile friendly (I'm on android and use duckduckgo) text box with border to rp (not a CS or anything like that) with a hidden scroll that work. I swear I tried looking on internet but I still don't get it (Did I told you I was lower than beginner at this stuff ? Cuz I think I am)

Here what I tried to do (I took out the [ ] cuz I can't even find how to make the code appear otherwise 🙃)
border=transparent; height:auto; width:100%; padding: 10xp ; overflow:hidden;
border=transparent; height:auto; width:200%; overflow-y:scroll;
H
H
H
H
H
J
J
N
N
N
N
B
B
B
/border
/border
 
so to start it off! instead of using the spoiler tag, use the code tag which is the word code with the [ and ] like you would do with border if that makes sense??

ok to break down your code

Code:
border=transparent; height:auto; width:100%; padding: 10xp ; overflow:hidden;
for starters, you need to give it a height and a width. 100% will make the area spread across the whole screen. it's better to use px for width - and the same with height. the famous uxie likes to say "cage ya dogs" - which is essentially what you're doing with this first border. also, you don't need to put the word "transparent" either~! you can simply put 0; instead and it'll work the same

so, for example, if we were going to make this area 100px by 100px the border tag would be:

Code:
[border=0; padding:10px; height:100px; width:100px; overflow:hidden]

okay so the next part

Code:
border=transparent; height:auto; width:200%; overflow-y:scroll;

Once again, you need to give a height to the code. It's best to put 100% here! as for width, it doesn't need to be 200%. it can be set to 100% - but the most important thing is to add padding-right! it's also recommended that you use latin or some sort of wording as a filler so you can see the full box's contents - i usually copy and paste from here. so it can be written out as:

Code:
[border=0; padding:0; height:100%; width:100%; overflow-y:scroll; padding-right:30px]

so now, let's put it altogether. i'm going to add in a background color so we can see it better;


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tristique laoreet mi, quis pulvinar nunc. Aenean arcu felis, malesuada ut erat in, congue interdum neque. Fusce ligula purus, ultrices a purus at, feugiat ultricies purus. Curabitur id suscipit justo. Curabitur mattis magna neque, vel lobortis tortor placerat at. Mauris ex leo, varius a dictum ac, fringilla ac enim. Vestibulum est leo, cursus sed ultricies vitae, mattis at eros. In quis volutpat enim. Sed gravida dignissim purus nec egestas. Curabitur facilisis fermentum sapien, fringilla sodales risus ultricies at.

Maecenas id lorem vitae arcu vehicula suscipit faucibus faucibus purus. Mauris eget molestie tortor. Donec ornare vitae velit quis vulputate. Suspendisse sagittis vel augue quis eleifend. Curabitur viverra nulla sed aliquam posuere. Pellentesque porttitor mauris vel urna dapibus rutrum. Donec rutrum consequat finibus. Vestibulum iaculis odio eu nibh sagittis tempus. Proin porttitor porttitor auctor. Nulla sagittis sapien et commodo efficitur. Donec pulvinar id risus eu sagittis. Nulla vestibulum lacus nec luctus fermentum.

Vestibulum vel posuere lacus, vel sodales lacus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Curabitur venenatis eu arcu sed semper. Cras aliquet nisi vitae nulla eleifend dictum. Etiam tincidunt ac sem eu laoreet. Aenean luctus pharetra est in luctus. Pellentesque ligula ex, lobortis a pulvinar sit amet, placerat nec leo. Cras fringilla nec turpis et varius. Integer luctus at metus nec porttitor. In vel massa a mi consectetur elementum. Aenean sit amet nulla felis. Pellentesque congue posuere erat non commodo. Curabitur interdum nisi scelerisque neque convallis, eu consequat elit feugiat. Nunc mollis malesuada nulla, vitae mollis odio convallis a. Integer quis dictum metus.


Code:
[border=0; padding:10px; height:100px; width:100px; background:pink;overflow:hidden][border=0; padding:0; height:100%; width:100%; overflow-y:scroll; padding-right:30px]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tristique laoreet mi, quis pulvinar nunc. Aenean arcu felis, malesuada ut erat in, congue interdum neque. Fusce ligula purus, ultrices a purus at, feugiat ultricies purus. Curabitur id suscipit justo. Curabitur mattis magna neque, vel lobortis tortor placerat at. Mauris ex leo, varius a dictum ac, fringilla ac enim. Vestibulum est leo, cursus sed ultricies vitae, mattis at eros. In quis volutpat enim. Sed gravida dignissim purus nec egestas. Curabitur facilisis fermentum sapien, fringilla sodales risus ultricies at.

Maecenas id lorem vitae arcu vehicula suscipit faucibus faucibus purus. Mauris eget molestie tortor. Donec ornare vitae velit quis vulputate. Suspendisse sagittis vel augue quis eleifend. Curabitur viverra nulla sed aliquam posuere. Pellentesque porttitor mauris vel urna dapibus rutrum. Donec rutrum consequat finibus. Vestibulum iaculis odio eu nibh sagittis tempus. Proin porttitor porttitor auctor. Nulla sagittis sapien et commodo efficitur. Donec pulvinar id risus eu sagittis. Nulla vestibulum lacus nec luctus fermentum.

Vestibulum vel posuere lacus, vel sodales lacus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Curabitur venenatis eu arcu sed semper. Cras aliquet nisi vitae nulla eleifend dictum. Etiam tincidunt ac sem eu laoreet. Aenean luctus pharetra est in luctus. Pellentesque ligula ex, lobortis a pulvinar sit amet, placerat nec leo. Cras fringilla nec turpis et varius. Integer luctus at metus nec porttitor. In vel massa a mi consectetur elementum. Aenean sit amet nulla felis. Pellentesque congue posuere erat non commodo. Curabitur interdum nisi scelerisque neque convallis, eu consequat elit feugiat. Nunc mollis malesuada nulla, vitae mollis odio convallis a. Integer quis dictum metus.
[/border][/border]

i hope this helps! i also have a tutorial on hidden scrolls and some different ways you can do it here (u‿ฺu✿ฺ)
 
What is this? Black magic ? 😶 It work !

Bless you, Weldherwings, Oh ! Savior of my post aesthetic ! May the Gods of the internet smile upon you !

(Translation: You saving me, You rock, You awesome take this 🥇)
 

Users who are viewing this thread

Back
Top