jquery播放幻燈片後需要重新載入頁面

Question

我正在運行Supersized Slideshow，它運行良好，但我需要在顯示幻燈片後刷新/重新加載頁面。照片是從我的服務器動態拉取的，並且可以在播放幻燈片時添加新照片。我希望它通過圖片播放，然後重新加載，以便它可以檢查新圖片。這裏是我使用的代碼

//php code to get pictures 

$picture = array(); 
    foreach($rows as $row) 
    { 
    $picture[] = $row["photo"]; 
    } 

    $newarray = array(); 
    for ($key_Number = 0; $key_Number < count($picture); $key_Number++) { 
    $newarray[] = "{image : '".$path . "/" . $album . "/" . $picture[$key_Number]."'}"; 

// Then in my Html 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
<script type="text/javascript" src="js/jquery.easing.min.js"></script> 
<script type="text/javascript" src="js/supersized.3.2.7.min.js"></script> 
<script type="text/javascript" src="theme/supersized.shutter.min.js"></script> 

    <script type="text/javascript"> 

     jQuery(function($){ 

      $.supersized({ 

       // Functionality 
       slide_interval   : 4000,  // Length between transitions 
       transition    : 1,   // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left 
       transition_speed  : 700,  // Speed of transition 
       new_window    : 1,   // Image links open in new window/tab 
       performance    : 1,   // 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)           
       image_protect   : 1,   // Disables image dragging and right click with Javascript 

       // Components       
       slide_links    : 'blank', // Individual links for each slide (Options: false, 'num', 'name', 'blank') 
       slides     : [   // Slideshow Images 

              <?php echo implode(',', $newarray) ?> 
              ] 

      }); 
     }); 

    </script> 
    } 

我想使用window.location.reload（）;或者像這樣的函數，但我不知道如何實現它或使其工作。感謝您的幫助。

Answer 1

這是我找到的解決方案。有點黑客，但工作得很好。我設置了一個計時器功能來計算幻燈片的長度，然後刷新頁面。由於我的幻燈片是從數據庫加載的，我使用php來計算長度。如果你硬編碼的圖片鏈接你已經知道你有多少，但不會需要刷新頁面.....

PHP

$count = $stmt->rowCount(); // counts how many pictures will be displayed 
$timer = $count * 4700; // slide length is 4000 and transition is 700 

然後在我的超大型功能

<script type="text/javascript"> 

     jQuery(function($){ 
      var interval = 4000, 
      speed = 700, 
      slideArray = [<?php echo implode(',', $newarray) ?>]; // add your slides to this array 


      $.supersized({ 

       // Functionality 
       slide_interval   : interval,  // Length between transitions 
       transition    : 1,   // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left 
       transition_speed  : speed,  // Speed of transition 
       new_window    : 1,   // Image links open in new window/tab 
       performance    : 1,   // 0-Normal, 1-Hybrid speed/quality, 2-Optimizes image quality, 3-Optimizes transition speed // (Only works for Firefox/IE, not Webkit)           
       image_protect   : 1,   // Disables image dragging and right click with Javascript 
       stop_loop    : false,  // Pauses slideshow on last slide 
       // Components       
       slide_links    : 'blank', // Individual links for each slide (Options: false, 'num', 'name', 'blank') 
       slides     : slideArray  

      }); 

     }); 
    </script> 


// here is where we reload the page 
// I pass the information needed to pull the pictures from the database 
// and in my php I check for a $_GET['email'] etc, etc, etc. to start the 
// process over. It then finds new pictures, counts them, displays them. 
// Hopefully this will help someone else 

     <script> 
      setTimeout(function() { 
        <?php echo 'window.location.href = "http://www.myurl.com/slideshow/slideshow.php?email='.urlencode($email).'&album='.urlencode($album).'&directory='.urlencode($directory).'&dir2='.urlencode($dir2).'"'; ?> 

      },<?php echo $timer; ?>); 
     </script>