使用jquery隐藏图像而不隐藏父DIV背景图像

Question

使用Jquery我在div中定位一个img来隐藏点击时隐藏它后面的视频iframe。 这样可以正常工作，但是，通过单击div，它还会隐藏父div背景图像。

请点击http://london.illustratedpeople.com/genx.html

上的其中一个视频，查看此处的工作示例

它似乎只是Safari中的问题，并且在Chrome中运行良好。

HTML：

<div class="profilevideo">
<img src="images/PLAY.png" width="600" height="338" alt="video" class="profile" />
<iframe src="http://player.vimeo.com/video/78191862?title=0&amp;byline=0&amp;portrait=0" width="600" height="338" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>

jquery的：

$('.profilevideo > img').click(function(event) {
event.stopPropagation();
var $img = $(this);
$img.hide();
$img.next().show();
});

更新 这是对我所看到的背景更改的引用，按照点击后和点击之前的顺序： imgur.com/sZ9ps59,wcFVWEj#0（1.点击后2.before）

先谢谢，我找不到办法解决这个问题！

布拉德利

Answer 1

我能想象的一件事（因为我无法从你的链接中得知）是当你隐藏图像时，它的css display属性设置为none;因为这样，包含的div将会缩小，因为没有任何东西可以强制它到现在的大小。

尝试手动设置容器的width和height，看看是否仍然存在。