hover updates tab

anonymous asked:

Hey there, I have been trying to find how to do the hover descriptions on contained themes that look kind of like an updates tab and I was wondering if maybe you knew how? Thank you, even if you don't still thank you because you do so much for the rp community and you're just amazing<3

hello there nonny,

settle in, it’s tutorial time!

how to make a hover description or updates tab


Keep reading



CODE ONLY ———- $10

You provide me with the graphics & specifications, I’ll code it.


You provide me with nothing but descriptions of how you wanted things, I’ll do the rest.


*The base code I made myself includes popups with one text space on each, a music player, & a sidebar. If you request something like multitabbed popups, a hover update tab, or the blobs in a jar effect, I will add an additional $5 for each.

If the requested task is removing something from the base code, no additional charge will be applied.


100x100, unedited* raw icons start at $5/50 icons. (E.G. - 100 flat icons would be $10.)
*I automatically clean all the caps. By unedited I mean no filters or anything fancy.

An icon PSD itself is $5, as well.

For a PSD to be applied to a set of icons, it is $2/50 icons. (E.G. - 100 formatted icons would be $4.)
*You can commission for a batch of icons to have a PSD that isn’t mine applied. It would be the same price.

Thank you for taking the time to read this, & thank you even more if you consider commissioning me! You can contact me for a commission via any blog that you know me on. If you’re unsure if I’m around on that blog at that time since I do blog hop, then just message me on oopheliac.

                                      – Andrew


Theme #16 Alya by Riverbell themes 

ver 1.0.1
» live preview and code


  • 400/250px wide posts with one or two columns (grid)
  • sidebar with description scrollbox and tumblr icon
  • sidebar slides out on hover - optional
  • updates tab
  • tooltips on navigation and permalinks
  • like and reblog buttons
  • 10 custom links (and pages) with a navigation pop up box for your links
  • infinite scrolling option

Terms of usage Please, do not steal, redistribute, remove credit or claim as your own. Alterations are ok! If there are any questions/problems please send me a message!

jinyoungslover  asked:

Hello:) i'm incredibly sorry to bother you omg you must be annoyed with these repetitive questions again, i was wondering about the update tab like is it possible to adjust the image to the other side? B.c when i paste in the code and everything the image is on the top right and when i hover over the photo the box drops down on the opposite side..? like what lol.

no love trust me when i say i always love to help as much as i can :)

okay so heres what apart of the first code that you shouldve copied under <style type=”text/css”>

okay so under this you need to check where it says

margin-left: 0px under #thekey img.

so if that number where it say 0px is anything other than 0 change it to zero.

if this doesnt work i recommend that you fix it in the code before you paste it to make sure its at 0px, if you need any other help, please come and ask! :)

(p.s. i hope you dont mind me posting this, this is just for anyone else who needs it too x)

sunbeamhighlighter  asked:

hey c: , im using the hover update tab, but its not working :c, the picture wont come out fully, and the announcement are all bunched up :c can you please help me !

ok so for the picture, to make it bigger or smaller you’re gonna go here (this is the first code that you paste under:

<style type=“text/css>)

****notice that it say #thekey img {      not #thekey ****

okay so to change the size of the picture that you’re using, you’re going to just change the part that says width: (…)px. To make the image bigger make the number bigger, and vice versa.

for the actual announcement box is a little trickier.

look for this part in the first code as well

then locate where it says:

margin-left: (blah blag blah) px

margin-top: (….) px

okay so to make the position of the box appear more to the right, your going to want to make the px on the margin-left a bigger number, and vice versa. (smaller number = box more to the left)

to make the box appear farther down, make the px on the margin-top a higher number, and vice versa as well. (lower # = box is higher)

also to make breaks or spaces between each line your gonna want to put <p> in the middle of each line, for example:

okay so i really hope this helped, if you have any questions, feel free to ask :)