jquery SuperSize нужно перезагрузить страницу после воспроизведения слайдов

0

Я запускаю 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(); или какая-то функция такая, но я не знаю, как ее реализовать или заставить работать. Спасибо вам за помощь.

Теги:
supersized

1 ответ

0

Вот решение, которое я нашел. Немного взлома, но работает очень хорошо. Я настроил функцию таймера, чтобы подсчитать длину слайд-шоу и обновить страницу. Поскольку мои слайды загружаются из базы данных, я использовал php для вычисления длины. Если у вас жестко закодированные ссылки на изображения, вы уже знаете, сколько у вас есть, но не нужно обновлять страницу.....

PHP

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

Затем в моей функции Supersized

<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>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню