css - 带有 CSS 的侧边栏

Question

我正在尝试制作一个 CSS 侧边栏。默认情况下它应该是隐藏的，只有这个图像从右边出来（见下文）。一旦用户将鼠标悬停在此图像上，它就会出现并显示一个带有一些文本的小框。

侧边栏不应位于右上角，而应位于屏幕高度的一半。我已经可以在左侧执行此操作且无需动画（参见代码）。在我看来这是不可能的：我讨厌 CSS（！！！），我希望有人可以帮助我做到这一点。非常感谢您的耐心等待并原谅我的问题，但我是 CSS 的大菜鸟。

编辑： http: //jsfiddle.net/WSZbe/1/这是我迄今为止的尝试......

#side{
position:absolute;
  top:0;
  left:0;
  height:40px;
allign: center;
background-color: blue; 

Answer 1

像这样的东西？我现在没有时间调整它，但如果那是你想要的，你应该明白...... FIDDLE Link

Answer 2

#side{
position:absolute;
  top:0;
  left:0;
  height:40px;
allign: center;
background-color: blue; 
}
#side:hover{
  position:absolute;
  top:0;
  left:200px;
  height:40px;
  allign: center;
  background-color: blue; 
}