小编Owl*_*wly的帖子

我在我的网站上嵌入了全屏YouTube视频.

当浏览器的大小与视频的宽度和高度成比例时,它看起来很好.但是,当我将浏览器的大小调整为不同的比例时,我会在视频周围看到黑条.

我想要的是让视频始终填满整个窗口,但没有任何拉伸.当浏览器大小与视频不成比例时,我希望隐藏"多余".

我想要实现的是你可以在这两个网站的背景中看到的:http://ginlane.com/和http://www.variousways.com/.

是否可以使用YouTube视频执行此操作？

所以我有这个简单的幻灯片：

<div class="container">
    <div id="slideshow">
        <img alt="slideshow" src="1.jpg" id="imgClickAndChange" onclick="changeImage()" />
    </div>
</div>

当我像这样单击时，我设法使图像发生了变化：

<script language="javascript">
    var imgs = ["2.jpg", "3.jpg", "4.jpg", "5.jpg"];

    function changeImage() {
        document.getElementById("imgClickAndChange").src = imgs[0];
        imgs.push(imgs.shift())
    }
</script>

问题是当我按下右箭头（下一个）和左箭头（返回）时，我还希望图像发生变化。我怎样才能做到这一点？我试过添加一个“onkeypress”事件，但似乎没有任何效果。我做错了什么。我对 javascript 很陌生，所以如果你能帮助我，那就太好了。谢谢 ：）