高级滚动显示额外选项

我有一个网络应用程序，其中包含用户评论列表。我想对这些意见（投票，回复等。）额外的选项只出现在评论本身就是鼠标悬停-ED高级滚动显示额外选项

的什么，我期待的是YouTube视频最好的例子：

当您转到注释时，选项（回复，投票上/下）仅在该特定评论滚动时才会显示。这是如何实现的？它只是一个使用jQuery（或类似的JavaScript库）和显示隐藏的div的问题？

编辑：

好了，所以我滚来滚去的元素是复杂的，我需要用JavaScript来做到这一点。我正在使用rails，所以原型就是这样！每个单独的列表项都有一个唯一的ID，但我不知道如何将这个ID变量传递给原型！这样它可以显示/隐藏特定列表项中的元素。我如何去做这件事？

“此视频包含来自EMI的内容，它不在您所在的国家/地区提供。” *摇在音乐行业的拳头* – 2010-10-22 03:49:24

这太糟糕了，这是一个平庸的广播歌曲很棒的视频 – goddamnyouryan 2010-10-22 04:49:23

在我看来，CSS是最好的方法。这里有一个垂直的方式：

HTML：

<div class='roller'> 
    <div>Options</div> 
    <div>Comments</div> 
</div>

CSS：

.roller { overflow:hidden; height:30px;line-height:30px } 
.roller:hover { height:60px }

这里是一个水平的方式，以相同的HTML：

CSS：

.roller { overflow:hidden;width:100px } 
.roller div { width:100px;float:left } 
.roller:hover { width:200px }

有点创意的三月杜松子酒/填充工作，你可以得到不同的结果。

此外，您可以使用first-child和/或下一个兄弟选择器或其他。

2010-10-22 03:48:10 Ben

纯CSS可能是一个选项，但我想我会用Jquery处理显示/隐藏，这样我就可以对每个元素进行全面访问。这样一来，我可能有条件地显示/隐藏元素基于登录，会话等

你还是会想建立的div出包含您的图标，并用CSS位置。背景更改也可以用Jquery处理，通过.css method

2010-10-22 04:12:44 bpeterson76

如果用户关闭了JS会怎么样？ – Ben 2010-10-22 04:28:18

坦率地说，我并不太担心，如果用户有js关闭..我的用户是相对年轻和网络精明。如果他们有js关闭然后拧他们，我不想要他们。但我喜欢这两种方法。 – goddamnyouryan 2010-10-22 04:39:54

@Steve，说实话，这不是一个比你想象的更重要的问题。另外，Jquery的显示/隐藏功能是逐步增强的，因此那些“有问题的浏览器”的用户将无法获得增强功能。 – bpeterson76 2010-10-22 14:11:38

回答