use this to add a floatie to your page without downloading a whole layout! (a separate png floating in the foreground in the corner) im not amazing at coding so basically its copied from tumblr & layout codes here!! credit to this one especially, go check it out ♥ Neptunia Layout
(add this to the top of your layout code in whatever style box ur using, above <style>)
<div class="floatie"></div>
(add this anywhere inside the <style> </style> tags, remember to add your chosen image url to the 'background:url' brackets. this takes a little trial & error since not every png will look perfect here, they MUST be transparent to work the best!!)
.floatie {
background: url(PUT YOUR IMAGE URL HERE) no-repeat;
background-size: 100%;
position: fixed;
right: -35px;
bottom: -10px;
height: 690px;
width: 590px;
z-index: 1000;
}
(i like the size of this one & its just the basic dimensions taken from the linked layout, but you can adjust the height & width also!! i messed around with it but liked it as it is the best)
again, im just the messenger, i only know a little about coding i just figured this out myself ^v^ using it on my own page if you wanna see what it looks like! i wont be answering questions coz idk what im doing lol
Comments
Displaying 8 of 8 comments ( View all | Add Comment )
gryhmz
IF YOU ARE TRYING TO ADD MULTIPLE FLOATIES TO YOUR PROFILE, PLEASE READ THIS. You cannot copy the code twice due to ID duplication. In other words, if you have one gif attached to the ID "floatie" then another gif cannot be attached to that same ID. So to fix this issue, all you have to do is:
1. paste another < div class="floatie">
between the first < style > < / style > of "floatie" and your new < style > < / style > for your new floatie.
2. Change the class to whatever new ID you want. Example: class="floatie-2"
3. Copy the code for "floatie" but change the ".floatie" at the beginning to your new ID. Example: .floatie-2
4. Change the .gif file in your new code for the new ID so it's not a duplicate GIF.
By doing this, you should be able to have multiple floaties on your page, but they must all have different IDs due to the HTML rule that one ID can be connected to only one attribute. Hope this helps!
Report Comment
KASPER
i dont think i really plan on using this, but atleast I know its called a floatie now and not just "floating image" LOL
Report Comment
Soos
thanks my profile is still learning how to swim
Report Comment
my profile is swimming blub blub
by Kiramen🐬Atlas; ; Report
ORION ECTOPLASM (#1 tokrev fan)
its not working what am i doing wrong?
Report Comment
Did you ever figure it out?
by MadMantis; ; Report
yes :3
by ORION ECTOPLASM (#1 tokrev fan); ; Report
Aw damn, I am struggling :')
by MadMantis; ; Report
i may be able to help!! feel free to message me and i can send you different versions of the code to see what works. i had to change it like six times
by ORION ECTOPLASM (#1 tokrev fan); ; Report
Thank you so much!! :3
by MadMantis; ; Report
What were some of the code changes you made? It’s not working for me either :,0)
by Libby 🍒; ; Report
not sure there could be a million problems with it.,, make sure your image is an accepted file and if youre trying to do multiple you have to number the div i think?
by ORION ECTOPLASM (#1 tokrev fan); ; Report
Could I possibly get some help too, please? Gosh every one I do doesn't work! I have the TINIEST bit of knowledge in CSS/HTML, idk if it's the fact I already have a layout or what :(
by ANGEL / JACK; ; Report
if you give me your discord i might be able to help better, mainly sending pictures to explain xd
by ORION ECTOPLASM (#1 tokrev fan); ; Report
THANK YOU!!! grr i just rlly want it to work i appreciate it! @4ngel1c_
by ANGEL / JACK; ; Report
Ghost_Boi
Thx, works really well!
Report Comment
MitochondRhia
This is so cool, just started using!! Is there a way to add more floats to the page or does it only work for just one?
Report Comment
Alright, ignore my comment from just a few minutes ago. I managed to figure it out myself. You cannot copy the code twice due to ID duplication. In other words, if you have one gif attached to the ID "floatie" then another gif cannot be attached to that same ID. So to fix this issue, all you have to do is
1. paste another < div class="floatie">
between the first < style > < / style > of "floatie" and your new < style > < / style > for your new floatie.
2. Change the class to whatever new ID you want. Example: class="floatie-2"
3. Copy the code for "floatie" but change the ".floatie" at the beginning to your new ID. Example: .floatie-2
4. Change the .gif file in your new code for the new ID so it's not a duplicate GIF.
By doing this, you should be able to have multiple floaties on your page, but they must all have different IDs due to the HTML rule that one ID can be connected to only one attribute. Hope this helps!
by gryhmz; ; Report
Oh hey, I totally forgot I left this comment here a long time ago, thanks for the reply!! I'm definitely gonna implement this info for the future, thanks dude!!
by MitochondRhia; ; Report
Anakin
Needed this omg
Report Comment
DDR 0_0
much thx!!
Report Comment