Javascript 如何在鼠标上方使图像成为嵌入式视频？

所以今天我学会了如何在鼠标上把一个图像换成另一个图像

---

不过我想知道，我可以用鼠标将图像更改为youtube视频吗？

当然，您可以替换任何HTML内容。为了更容易处理事件处理程序（在您的例子中，鼠标放在上面），我建议您查看一些现有的Javascript库，例如。

使用jQuery和一些CSS：

演示：

---

---

你能给我一个例子吗？我想把这个图片改成这个视频：但是我对javascript（我知道html，css）很陌生这里有一些html内容替换的例子：-对于你的具体情况，你可以将图片添加到页面上，然后将

鼠标移到
事件处理程序绑定到
img
元素上。然后，这将触发jQuery的
replaceWith
方法，将其替换为嵌入式youtube视频。下面给出了另一个解决方案，您可以在youtube视频的顶部显示图像（使用CSS）。然后，
mouse-over
事件应该调用
img
标记上的
hide
（仍然假设您将使用jQuery）；）祝你好运你可以，但你真的不应该。
<!-- HTML -->
<div class="replacement">
    <img class="top-img" src="http://placekitten.com/560/315" alt="Kitten">
    <iframe class="video" width="560" height="315" src="http://www.youtube.com/embed/H93n-k3SkiQ" frameborder="0" allowfullscreen></iframe>
</div>

/* CSS */
.replacement {
    position: relative;
}
.top-img {
    position: absolute;
}

// jQuery
jQuery(document).ready(function($) {
    $('.replacement .top-img').on('mouseenter', function () {
        $(this).fadeOut(500);
    });
});