iframe/ハイパーリンクの内側にある部分にカーソルを合わせると、アニメーションが機能するようにしたいと思います。現在、何も起こりません。マウス オーバー イベント (アクション) が何をすべきかを確認できるように、ウェブサイトの div の幅を少し広げました。
Html (動画用):
<div id="box3" onmouseout="$('#box3').stop().animate({boxShadow: '10px 10px 15px', top: 0}, 'fast')"
onmousemove="$('#box3').stop().animate({boxShadow: '3px 3px 3px', top: 3}, 'fast')" style="top: 0px;
width: 710px;
box-shadow: 10px 10px 15px 0px rgb(102, 102, 102);">
<iframe width="700" height="525" id="under" src="http://www.youtube.com/embed/LRo-L9zYf-M" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
css と z-index を使用して iframe の前に別の div を配置しようとしましたが、うまくいきませんでした
CSS:
#under {
width: 100%;
height: 100%;
position: relative;
}
#box3 {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
#box3 {
z-index: 10;
どんなアイデアでも大歓迎です
ありがとう