Floating semi-transparent box in bottom right corner of page
63,452pages on
this wiki
this wiki
Forum page
Wikia's forums are a place for the community to help other members.
To contact staff directly or to report bugs, please use Special:Contact.
To contact staff directly or to report bugs, please use Special:Contact.
Note: This topic has been unedited for 953 days. It is considered archived - the discussion is over. Do not add to unless it really needs a response.
I've seen these things on peoples Userpages and user talk pages, both on Wikipedia and here.
They're semi-transparent, they're always in the bottom right corner of the screen, and when you scroll up/down, they follow the scrolling and remain in the corner, and they're customizable, you can change the color, text, etc.
I couldn't remember where I had seen them, but I found a good example on Dfrg.msc's userpage on Wikipedia. Only difference between his and the others is his is an image of some sort.
The one I'm trying to figure out how to make is like a notice box, and you can change the text inside it.
Anyone know how to make these? T 00:43, October 12, 2009 (UTC)- Well, if you would like the way he does it, you use the following code, replacing the link and image with what you want to float:
<div style="position: fixed; right:0; bottom:0; display:block; height:{{{1|150}}}px; width:{{{1|150}}}px;"><div style="position: relative; width: {{{1|150}}}px; height: {{{1|150}}}px; overflow: lolz">
<div style="position: absolute; top: 0px; left: 0px; font-size: 300px; overflow: hidden; line-height: 300px; z-index: 3">''[insert link]''</div>
<div style="position: absolute; top: 0px; left: 0px; z-index: 2">[[File:Insert image|150px]]</div>
</div>
</div>
- Yes, that helps if I want to use an image, but I'm unsure if I can take that code above, and change it to be like a notice box with customizable text... T 01:26, October 12, 2009 (UTC)
- Essentially, you can wrap
<div style="position:fixed;"></div>around whatever you want to make fixed (doesn't move even if you scroll.) You can wrap it around a table, some text, an image or anything else you can put in div tags (essentially.) Then you can put it wherever, bottom right corner, top left, middle, etc. ~Joey~ ^Talk^ 01:26, October 12, 2009 (UTC)
| This is text in a table |
- Oh wow! That's basically it! Only thing missing is the ability to make the background colored, yet slightly transparent so you can still read what's underneath the box. Know how to do that? T 01:35, October 12, 2009 (UTC)
- Nevermind, I figured it out. Thanks for the help, I've got it covered from here! T 01:54, October 12, 2009 (UTC)