html - 如何修复悬停效果的过渡 + 在 tumblr 帖子上添加链接

Question

我编辑了我的主题，所以标签会显示在帖子底部的下拉框 (?) 上(这应该是源代码，正如你在原文中看到的那样)但现在它不会像之前，它立即出现，我尝试更改所有过渡值但它不起作用......有没有办法解决它？
• 我的主题[ http://joltikillua.tumblr.com/ ]
• 原始主题的静态预览[ http://yukoki-th.tumblr.com/th29 ]

另一个问题，有没有办法在帖子的旁边添加一个“reblog”链接，比如这个帖子:[ 34kojin.tumblr.com/]？也许也可以选择添加永久链接？!就像一个漂浮在一边的小菜单？!
所以当鼠标悬停时，我的主题会在下拉框中显示标签，在帖子的一侧显示链接？

我希望这是有道理的，我对 html/css 了解不多，而且我的英语不好，但我会很感激任何帮助!

Answer 1

很难查看您的代码。

我已经为您制作了一个小示例，说明如何使用纯 CSS 动画正确地使您的扩展框增长。

此处:http://jsfiddle.net/okwky7qL/

请将 -webkit-transition: ... 的顺序更改为我这里的顺序:

#permalink, .preblog {
  font-family: bitxmap;
  font-size: 10px;
  color: {color:permalink text};
  background-color: {color:permalink bg};
  overflow: hidden;
  padding: 0 10px;
  -webkit-transition: 0.8s ease-in-out;
  -moz-transition: 0.8s ease-in-out;
  -o-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
 }

#permalink { line-height: 22px;}
 .preblog {
   padding: 0 0;
   height: 22px;
}

 {block:if1column}.posts:hover .preblog {height: 55px;}{/block:if1column}

使用我示例中的代码再次检查 CSS 中的代码。