Shop Mobile More Submit  Join Login
Scrolling Widgets (non-Custom Box) by SimplySilent Scrolling Widgets (non-Custom Box) by SimplySilent
If this is not making any sense to you, please make sure to first read =TaNa-Jo's Custom Box Tutorial about adding background images. :aww:

Background image used: Free Blue Content Holder by =Kimikokawaiichan



Paste the following codes into the text box of your widget. If you'd like to see some live versions, see my profile here.


Regular Background Scroll Code: Use if your background image cannot be stretched.

<div class="previewbox"><div class="popup2-moremenu"><div class="floaty-boat"><br><img src="IMAGE URL"></div></div><div class="gr-box gr-genericbox"><div class="pp"><div class="pp">CONTENT HERE</div></div></div></div>


Adjustable Background Scroll Code: Use if you background image can be stretched.

<div class="previewbox"><div class="popup2-moremenu"><div class="floaty-boat"><br><img src="IMAGE URL" width="900" height="650"></div></div><div class="gr-box gr-genericbox"><div class="pp"><div class="pp">CONTENT HERE</div></div></div></div>


Scrolling Custom Box Widget

The code for this one can be found here:

Thank you to =fluf-studios for figuring this out!
Add a Comment:
 
:icon9afeyah:
9afeyah Featured By Owner 2 days ago  Hobbyist Artist
Thank you :)
Reply
:icondeathangelsuki:
DeathAngelSuki Featured By Owner May 16, 2015  Hobbyist General Artist
is this only for premiums?
Reply
:iconbisharps:
bisharps Featured By Owner May 17, 2015  New member Hobbyist General Artist
yep
Reply
:icondeathangelsuki:
DeathAngelSuki Featured By Owner 6 days ago  Hobbyist General Artist
thanks
Reply
:iconbisharps:
bisharps Featured By Owner 6 days ago  New member Hobbyist General Artist
welcome !!
Reply
:icongothicblueeyes:
GothicBlueEyes Featured By Owner Apr 6, 2015  Student Digital Artist
I have a question, and its not about this piece, but, how do you get the code to show up like that in the description?
I can't find it ANYWHERE to how to do that.
Please, tell me of your wisdom of magic. :la:
Reply
:icondevendesign:
DevenDesign Featured By Owner Mar 20, 2015  Professional Digital Artist
I thought you would have put CSS in the description box to stylize the custom widget.  I guess it's HTML.
Reply
:iconlaughbutts:
LaughButts Featured By Owner Jan 24, 2015  Hobbyist Digital Artist
You know how the Webcam widget asks for an image link, and then it displays that image link is full size, and the actual widget would change heights just to show the full webcam?

Well, it looks like DA turned the Webcam into a Custom Box, and now, I am trying to figure out how to get the custom box to display the same full image without an awkward blank space in the bottom like depicted here. The only way I have been able to display the image in full size is by making the image the "background image" with not content, but to get the image to show completely, I have to add all these spaces, but depending on the computer monitor screen and resolution, there could still be an awkward blank space on someone else's  computer. 

Do you know if there was any way to fix this type of issue for custom boxes? 
Reply
:iconpockycatinsanity:
PockyCatInsanity Featured By Owner Nov 23, 2014
May i ask how to do a content holder box with a scrolling thing ;o;
Reply
:iconpockycatinsanity:
PockyCatInsanity Featured By Owner Dec 20, 2014
oh its alright but thank you!
Reply
:iconkatklt:
KATKlT Featured By Owner Dec 20, 2014  Hobbyist General Artist
ahah you're welcome!
Reply
:iconpokemonsonicgirl123:
pokemonsonicgirl123 Featured By Owner Oct 18, 2014  Hobbyist General Artist
Will this work on journal skins? I mean, I was using this one skin with a footer and sidebar and tried to use the scrollbox code, but when I click preview, all I get is this white background with whatever stamps I'm using going off the page. Did I paste the code into the wrong area or something?
Reply
:iconnoragamiii:
Noragamiii Featured By Owner Sep 13, 2014  Hobbyist Artist
I think I might have found a slight issue?

So I am trying to use your profile directory WITH this code. I dont think these two are working together well.

Please let me know if I'm just using the codes wrong or if these two will not work together. 
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Sep 13, 2014
The profile directory wasn't made to be combined with this scrolling, unfortunately.
Reply
:iconnoragamiii:
Noragamiii Featured By Owner Sep 13, 2014  Hobbyist Artist
Oh dont worry I found a way around it!

I used this scrolling box code: tana-jo.deviantart.com/art/Box… and simply took out the background image out side of the scroll box.

You can see what I did on my commissioner's page here: nezuney.deviantart.com/

You might wanna put that info in the description for others. 
Reply
:iconprincess-starflok:
Princess-Starflok Featured By Owner Jul 8, 2014  Professional Digital Artist
how about custom boxes?
Reply
:iconxxpurpletreasurexx:
xXPurpleTreasureXx Featured By Owner Jun 28, 2014  Hobbyist Digital Artist
uh doesnt even work for me at all
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jul 5, 2014
You need to be a premium member, I'm afraid.
Reply
:iconxxpurpletreasurexx:
xXPurpleTreasureXx Featured By Owner Jun 28, 2014  Hobbyist Digital Artist
nvm xD
Reply
:iconp0tat0-kun:
P0TAT0-KUN Featured By Owner May 21, 2014  Hobbyist Digital Artist
umm.. I'm sorry if I ask stupid question but, are non-membership allowed to do this? QvQ
sorry for my english :iconuhuhuhuplz:
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jun 5, 2014
No, unfortunately not. :hmm: Most custom box codes only work for premium members.
Reply
:iconget-hiki-brah:
get-HIKi-brah Featured By Owner May 24, 2014  Hobbyist General Artist
Members are can do this in custom boxes but I assume that any member that can edit their other widgets can use the same codes as well. ^w^ (I've seen it on some past pages before)
Reply
:iconcassy007:
Cassy007 Featured By Owner Apr 26, 2014  Hobbyist Digital Artist
does this also work for the ID widget? (i think it does but just to make sure :?)
Reply
:iconsimplysilent:
SimplySilent Featured By Owner May 2, 2014
It does. :)
Reply
:iconcassy007:
Cassy007 Featured By Owner May 3, 2014  Hobbyist Digital Artist
thx ^^
Reply
:icondreadbot24:
Dreadbot24 Featured By Owner Feb 26, 2014  Hobbyist General Artist
Thanks so much!! This is fantastic~ :love:
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Mar 2, 2014
No problem at all!
Reply
:iconbellechan:
Bellechan Featured By Owner Jan 22, 2014  Hobbyist General Artist
Thank you for this!!

Is there a way to hide the scroll bar? 
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jan 22, 2014
Unfortunately not. :hmm:
Reply
:iconbellechan:
Bellechan Featured By Owner Jan 28, 2014  Hobbyist General Artist
What a pity =[

Thanks for the reply! :hug:
Reply
:iconaoki-kimi:
Aoki-kimi Featured By Owner Jan 22, 2014  Hobbyist Traditional Artist
How to use this in Journal? QAQ
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jan 29, 2014
Ah, this is only for custom boxes, actually. :)
Reply
:iconmrsketchy:
mrSketchy Featured By Owner Feb 23, 2014
the name of the tutorial says "non-custom box"
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Feb 23, 2014
My bad. I meant that these can only be used in widgets, not journals. ^^;
Reply
:iconmrsketchy:
mrSketchy Featured By Owner Feb 24, 2014
maybe change it so as to stop any more confusion
Reply
:iconaoki-kimi:
Aoki-kimi Featured By Owner Jan 29, 2014  Hobbyist Traditional Artist
Ooh.. ^^
Reply
:iconginryuzaki:
Ginryuzaki Featured By Owner Nov 6, 2013
Thank you so much for this! :iconiloveyouplz:
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Nov 6, 2013
No problem!
Reply
:iconuglyellie:
UglyEllie Featured By Owner Sep 4, 2013  Hobbyist General Artist
thankk you! Love
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Sep 6, 2013
:huggle:
Reply
:iconreadordead:
ReadOrDead Featured By Owner Sep 2, 2013
A problem I'm having is that if you change the width of your browser the width of the boxes changes, which causes the height of the content (and thus the box) to change and leave an empty strip at the bottom. Is there a way of having pure colour (not image) I wonder?
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Sep 2, 2013
As far as I know, I don't believe that there is a way :(
Reply
:iconreadordead:
ReadOrDead Featured By Owner Sep 3, 2013
LE SIGH </3
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Sep 3, 2013
:saddummy:
Reply
:iconftsarts:
FTSArts Featured By Owner Aug 18, 2013  Hobbyist General Artist
Do you know if this works for the Journal Widget? 
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Aug 18, 2013
The code that you use on your profile is HTML while the code you can use in journals is CSS. Adding scroll boxes is really easy if you want to give it a try. :D

To make the entire journal scroll, you can type in the CSS:

.gr-box{
height:500px;
overflow: auto;}

All you need is to specify a height and to put overflow:auto :D
Reply
:iconftsarts:
FTSArts Featured By Owner Aug 18, 2013  Hobbyist General Artist
Awesome thanks for clarifying that for me :)

Reply
:iconsimplysilent:
SimplySilent Featured By Owner Aug 18, 2013
No problem :D
Reply
:iconnesmaty:
Nesmaty Featured By Owner Aug 3, 2013
I love you guys for this :heart:
Reply
Add a Comment:
 
×
Download PNG 801 × 3207




Details

Submitted on
July 31, 2013
Image Size
501 KB
Resolution
801×3207
Link
Thumb
Embed

Stats

Views
17,228 (13 today)
Favourites
902 (who?)
Comments
109
Downloads
36
×