在iframe中使图像大小响应

时间:2017-05-15 20:09:29

标签: html css

我在页面上有一个iframe,它将显示我正在托管的图像文件。

我可以让iframe响应,使其变得更大或更小,具体取决于窗口大小,但我希望iframe规模中的实际图像适合iframe,而不是当iframe变小时显示滚动条图片。有没有办法做到这一点?

以下是我正在使用的代码,其中http://example.net/picture.jpg是托管图片。

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
        var frm = ['gallery', 'info'];
        var hrf = ['http://example.com/', 'http://example.net/picture.jpg'];

        function setSource() {
            for(i=0, l=frm.length; i<l; i++) {
                document.querySelector('iframe[name="'+frm[i]+'"]').src = hrf[i];
            }
        }
    </script>
</head>
<body>
    <iframe src="" name="gallery"></iframe>
    <iframe src="" name="info"></iframe>
    <span onclick="javascript: setSource();">Click me</span>
</body>
</html>

0 个答案:

没有答案