将鼠标悬停在视频或div上，在视频中显示div

Question

我有一个div，它从数据库中获取内容。内容可以是文字或视频，并保存在div中。

我希望在用户将鼠标悬停在文字或视频上时显示Read more文字，如下所示：

请提出任何建议。

Answer 1

有许多教程可以开始搜索它们，也许本教程可能有助于注意演示http://www.backslash.gr/demos/contenthover-jquery-plugin/#demo1

HTML

<img id="d1" src="photos/1.jpg" width="300" height="240" />
<div class="contenthover">
    <h3>Lorem ipsum dolor</h3>
    <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum pulvinar ante quis augue lobortis volutpat. </p>
    <p><a href="#" class="mybutton">Lorem ipsum</a></p>
</div>

CSS

.contenthover { padding:20px 20px 10px 20px; }
.contenthover, .contenthover h3, contenthover a { color:#fff; }
.contenthover h3, .contenthover p { margin:0 0 10px 0; line-height:1.4em; padding:0; }
.contenthover a.mybutton { display:block; float:left; padding:5px 10px; background:#3c9632; color:#fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.contenthover a.mybutton:hover { background:#34742d }

Jquery脚本：

$('#d1').contenthover({
    overlay_background:'#000',
    overlay_opacity:0.8
});

Answer 2

我认为你可以创造另一个div并绝对设定它的位置，然后你可以做你想做的事情。不知道我是不是。