jquery - 将鼠标悬停在视频或 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 并绝对设置它的位置，然后你可以做你想做的事情。不知道如果我是对的。