我有一张我希望用户看到的图像。当用户单击该图像时,我希望该图像消失并在其位置显示视频。有人可以告诉我该怎么做吗?
这是我到目前为止的代码。
<div id="homeflash" style="height:413px; background-image:url(../../../upload/1/img/homeFlashBG.jpg);">
<a href="#">
<img src="../../../upload/1/img/video.jpg" style="display:none" />
</a>
<div id="video" style="display:inline">
<iframe allowfullscreen="" frameborder="0" height="395" src="//www.youtube.com/embed/X8mLel_werQ?rel=0" width="691"></iframe>
</div>
</div>
如果有人可以编辑我的帖子以清理代码,那就太好了。我不知道。
稍微描述一下代码:单击图像后,代码应如下所示。当您第一次看到该页面时,这两种显示样式将颠倒。
任何帮助都会很棒。
谢谢
一个一般的想法可以是这样的:
$(function() {
$("img").click(function() {
$(this).css("display","none"); // will hide your image
$("body").append("<div id='video'></div>"); // will append div with id video, this div should have video code inside this.
});
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句