Question

我有类似的东西

<div draggable="true">
<iframe width="640" height="360" src="http://www.youtube.com/watch?v=dQw4w9WgXcQ?fs=1&amp;feature=oembed" frameborder="0" allowfullscreen="">
</iframe>
</div>

我希望能够通过点击包含iframe的div上的任意位置来拖动整个div。但是，iframe不会级联事件。我还想保持与youtube视频的互动（播放，全屏等）。

有没有人知道如何用html / css / js / jQuery做到这一点？

Answer 1

这里你有一个你想要的近似例子....只需修复一下

#dra
{
    width:560px;
    height:315px;
    border:1px solid green;
    cursor:pointer;

}

#dra:hover iframe
{
    z-index:-1;position:absolute;
}

<div id="dra"><iframe  width="560" height="315" src="http://www.youtube.com/embed/T6s3d2wdXVg" frameborder="0" allowfullscreen></iframe></div> 
<script>
$( "#dra" ).draggable({stop: function() {

                $( "iframe" ).css('z-index','0');
            }});

</script>

从父iframe子项开始拖动父项

1 个答案: