Take the 2-minute tour ×
Web Applications Stack Exchange is a question and answer site for power users of web applications. It's 100% free, no registration required.

Do you know how to show tags, notes, and permalink info on hover? Like if my blog shows the tags, notes, perm and such on the bottom of each post and i want to change it so it only shows on hover.

share|improve this question

1 Answer 1

It depends on your theme, but you're probably gonna have to find the name of the div that contains the post info, and then add some CSS to hide that div by default and show it on hover.

For example, this is the CSS I added to my theme (right before {CustomCSS} in the theme code):

body.index .post .meta {
   opacity: 0; 
   height: 0;
}
body.index .post:hover .meta {
   opacity: 1;
   height: auto;
}

So for my theme, the container for the post info is .meta, and it shows when you hover on the div for the whole post, which is .post, but adding body.index before .post limits it to only showing on posts on my main index page, not on my individual permalink post pages.

If you want a smoother transition you can add a few lines (for compatibility with different browsers) to both of the css tags, something like this:

body.index .post .meta {
   opacity: 0; 
   height: 0;
   -moz-transition-duration: .2s;
   -webkit-transition-duration: .2s;
   transition-duration: .2s;
}
body.index .post:hover .meta {
   opacity: 1;
   height: auto;
   -moz-transition-duration: .2s;
   -webkit-transition-duration: .2s;
   transition-duration: .2s;
}

It's more helpful if you link to your theme and/or blog, so we can see the actual tags they use, but if you wanna figure it out, there's some more info on this answer as well: How to show tags on tumblr when you hover over a picture?

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.