我正在运行超大幻灯片,它运行良好,但我需要在显示幻灯片后刷新/重新加载页面。图片是从我的服务器动态提取的,可以在播放幻灯片时添加新图片。我希望它播放图片,然后重新加载,以便它可以检查新图片。这是我正在使用的代码
//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()或类似的函数,但我不知道如何实现它或使其工作。 谢谢你的帮助。
这是我
找到的解决方案。有点黑客,但效果很好。 我设置了一个计时器函数来计算幻灯片的长度,然后刷新页面。 由于我的幻灯片是从数据库中加载的,因此我使用 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>