Saturday, 15 June 2019

Pause the slider when a video appears

I have a slider that was created for me years ago. The slider supports both images and video with a timer but the timer is for both, so for example if I set the timer to run every 10 seconds it would rotate the slider every 10 seconds. The issue I am facing is if the video isn't finished it would just cut off the video at 10 seconds.

Here is the json file structure:

// Json Object
var data = [{

    tags: [{
    name: 'a',
    content: '<img src="images/1.jpg">',
                cssanimate: 'fadeIn',
                attr: {
                    href: '#',
                    title: 'Image With Hyperlink'
                }
            }]
    },{
    tags: [{
        name: 'video',
        source: {
            mp4: 'sample2.mp4',
            ogg: ''
        }
    }]

}];

// Call Slider function
$(window).load(function () {
    $('#slideshow-slider').jSonSlider({
    'loadallslides': false,
    'auto': [true, '1000'],
    'nextprev': false,
    'circular': true,
    'pagi': false,
    'data': data
    });
});

What I need it to do is pause the slider when video is playing. After the video ended triggers, resume the slider. I believe the slider can be paused using the following (coming from the developer)

_this.find(’.playpause.pause’).trigger(‘click’)

Here is the full js code:
https://jsfiddle.net/wxvynp09/

Thank you!
Any help would be greatly appreciated!



from Pause the slider when a video appears

No comments:

Post a Comment