SSL issues when use Supersized Slideshow with OpenCart

Question

I have Using Supersized Slideshow in OpenCart. but when use SSL so not change HTTPS image path in Supersized Slideshow.

You can see Supersized Slideshow below code.

How to fix? please help me. Thanks

<script type="text/javascript">
            jQuery(function($){

                $.supersized({

                    // Functionality
                    slide_interval          :   5000, // 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        :   750,        // Speed of transition

                    // Components                           
                    slide_links             :   'blank',    // Individual links for each slide (Options: false, 'num', 'name', 'blank')
                    slides                  :   [           // Slideshow Images
<?php $i = count($banners); foreach ($banners as $banner) { ?>
<?php if ($banner['link']) { ?>
{image : '<?php echo $banner['image']; ?>', title : '<?php echo $banner['title']; ?>', thumb : '<?php echo $banner['image']; ?>', url : '<?php echo $banner['link']; ?>'} <?php if($i>1){ echo ","; }?>
<?php } else { ?>
{image : '<?php echo $banner['image']; ?>', title : '<?php echo $banner['title']; ?>', thumb : '<?php echo $banner['image']; ?>'}<?php if($i>1){ echo ","; }?>
<?php } ?>
    <?php $i--; } ?>    
            ]
                });
            });
        </script>

Answer 1

Usually this happens when you set the image in the back end to an absolute path, e.g. http://www.example.com/image/data/banner1.jpg

If you can get away with it, set it to /image/data/banner1.jpg or even //www.example.com/image/data/banner1.jpg