Question

您好，并提前致谢！我在一些帮助下创建了以下代码，以幻灯片形式显示文件夹中的图像。如果没有人做某事，那么每一分钟都会重新加载自己。这是在幻灯片放映运行时显示新图像。如果上传的图像很小（<1MB），则幻灯片显示一切正常。但我是否上传或复制较大的图像幻灯片翻转或旋转图像180'或90'。

这是代码：

<?php
$dir_path = "uploads/prints/";

$extensions_array = array('jpg','png','jpeg');

if(is_dir($dir_path))
{
$files = array_slice(scandir($dir_path), 2);
foreach ($files as $file)
{
    $ext = pathinfo($file);
    $ext = $ext['extension'];

    if(in_array($ext, $extensions_array))
        $images[] = '<img class="mySlides" src="'. $dir_path . $file.'" style="max-width:90%";>';
}
}
?>

<!DOCTYPE html>
<html>
<head>
<title>automatic slideshow</title> 
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<style>
.mySlides {display:none;}
</style>
</head>
<body background="/back2.png">

<!--<h2 class="w3-center">Automatic Slideshow</h2> -->
<div class="w3-content w3-section" style="width:500px">
<?php echo implode ($images); ?>
</div>


<script>
    var myIndex = 0;
    carousel();

    function carousel() {
        var i;
        var x = document.getElementsByClassName("mySlides");  
        for (i = 0; i < x.length; i++) {
            x[i].style.display = "none";  
        }
        myIndex++;
        if (myIndex > x.length) {myIndex = 1}   
        x[myIndex-1].style.display = "block";  
        setTimeout(carousel, 4000); // Change image every 4 seconds
    }

//refresh page
 var timeout = setTimeout("location.reload(true);",60000);
  function resetTimeout() {
clearTimeout(timeout);
timeout = setTimeout("location.reload(true);",0000);    
  }     

</script>
</body>

有没有人有想法？

为什么我的javascript代码会旋转大图像（＆gt; 1MB）？

0 个答案: