繁体   English   中英

如何显示来自 mysql 数据库的图像幻灯片

[英]How to display a slideshow of images from a mysql database

我有一个名为images的表,字段为id, name, photophoto字段为varchar因为图片使用 php 表单存储到服务器上。 在我的代码只显示表格中的 1 张图像的那一刻,请有人帮助我,以便它使用查询对所有图像进行幻灯片放映:

SELECT * FROM images WHERE name='$pagetitle'

$pagetitle在脚本的其他地方定义。

问题出在 index.php 文件中

索引.php

 <!-- Image Slide Show Start --> <div style="display: flex; justify-content: center;"> <img align="middle" src="" name="slide" border=0 width=300 height=375> <?php require('mysqli.php'); $data = $conn->query("SELECT * FROM images WHERE name= '$pagetitle'"); $image = mysqli_fetch_array( $data ); $directory = ("/images/".$image['photo'] . ""); $conn->close(); ?> <script> //configure the paths of the images, plus corresponding target links slideshowimages("<?php echo $directory ?>") //configure the speed of the slideshow, in miliseconds var slideshowspeed=2000 var whichlink=0 var whichimage=0 function slideit(){ if (!document.images) return document.images.slide.src=slideimages[whichimage].src whichlink=whichimage if (whichimage<slideimages.length-1) whichimage++ else whichimage=0 setTimeout("slideit()",slideshowspeed) } slideit() </script> </div><br><br> <!-- Image Slide Show End -->

解决的代码如下:

 <?php // Connect to the database require('mysqli.php'); // Query for a list of all existing files $sql = "SELECT * FROM images WHERE name= '$pagetitle'"; $result = $conn->query($sql); $directory = ''; while( $image = $result->fetch_assoc() ) $directory .= ($directory != '' ? "," : '') . ('"/images/'.$image["photo"] . '"'); // Check if it was successfull if($directory != '') { // if there are images for this page, run the javascript ?><script> //configure the paths of the images, plus corresponding target links slideshowimages(<?php print $directory ?>) //configure the speed of the slideshow, in miliseconds var slideshowspeed=2000 var whichlink=0 var whichimage=0 function slideit(){ if (!document.images) return document.images.slide.src=slideimages[whichimage].src whichlink=whichimage if (whichimage<slideimages.length-1) whichimage++ else whichimage=0 setTimeout("slideit()",slideshowspeed) } slideit() </script> <? } else { // If there are not any images for this page, leave the space blank echo ""; } // Close the mysql connection $conn->close(); ?>

<?php 
$servername = "";
$username = "";
$password = "";
$dbname = "";
$conn = new mysqli($servername, $username, $password, $dbname);

//Make connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

//SQL query
$sql = "SELECT * FROM TABLE_NAME";
$result = $conn->query($sql);

if ($result->num_rows > 0) {

    while($row = $result->fetch_assoc()) {
        $dir= "" . $row["field"]. "";
       echo" <div class='content section' style='max-width:500px'>
             <img class='slides' src='$dir' style=width:100%></div>";
    }
} else {
    echo "Empty Gallery";
}
?>

<html>
<body>
<script>
var index = 0;
slideshow();
function slideshow() {
  var i;
  var x = document.getElementsByClassName("slides");
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";  
  }
  index++;
  if (index > x.length) {index = 1}    
  x[index-1].style.display = "block";  
  setTimeout(slideshow, 3000); // Change slides every 3 seconds
}
</script>
</body>
</html>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM