Question

我有一个内联框架，可以调用多个URL，一些代码和KPI。现在，我正在尝试构建一个类似于google幻灯片的演示文稿，该演示文稿显示图像并每30秒更改一次。我直接从文件夹中读取了图像，但无法使其全屏显示，它始终具有原始图像属性。

<?php

$pasta = 'imagens_comunicados_internos/';
$arquivos = glob("$pasta{*.jpg}", GLOB_BRACE);

$total_imagens = count($arquivos);

foreach ($arquivos as $img) {
    echo 'https://localhost/tv/' . $img . "</br>";
}


$pasta = 'imagens_comunicados_internos/';
$arquivos = glob("$pasta{*.jpg,*.JPG,*.png,*.gif,*.bmp}", GLOB_BRACE);

$i = 0;
$imagens = array();

foreach ($arquivos as $img) {
    $imagens[] = 'https://localhost/tv/' . $img;
    $i++;
}


?>

<script>
    //'https://localhost/tv/index.php',
    //'https://localhost/tv/index.php?acao=1'
    url = [''

    ];

    urls = url.concat(<?php print_r(json_encode($imagens)) ?>);

    position = 0;
    element = document.getElementsByTagName('iframe')[0];

    element.onload = frameLoaded;

    next();

    function next() {
        if (position >= urls.length) {
            position = 0;
            element.src = urls[position];

        } else {
            element.src = urls[position];
            position += 1;
        }
    }

    function frameLoaded() {
       setTimeout(next, 5000);

    }
</script>

Answer 1

直接在iframe中加载图片会以常规尺寸显示图片。如果您希望它更大，更宽等，则需要加载一个HTML页面来加载图像。在该HTML页面上，使用CSS使其填充页面窗口。

您可以使用参数和一个PHP页面来执行此操作，该页面将加载通过查询字符串参数传递给它的图像。

如果您没有在iframe中显示图像的HTML页面，则将无法使图像充满页面。它将以确切的图像尺寸显示它。

在iframe上加载图片后，图片无法全屏显示

1 个答案: