Making youtube work on thumb click

luka's Avatar

luka

05 Jul, 2013 08:28 PM

Hi,

I am having problems with YouTube video and autoplay. I have a website where I'm using royalslider. And I'm having issues with video. there are two things I need to accomplish.

1. When I click on the first (Home) slide the picture below NERA text - that one goes to second slide. It should start to play the first video in slider. I have tried with API functions. But somehow, it does not work.

2. I would like to autoplay the video when I click the thumbnail. Is that possible? I have tried various combinations with API functions and scripts - but my JavaScript skillz are obviously lower than avg.

Kind regards

Luka

  1. 1 Posted by luka on 05 Jul, 2013 08:39 PM

    luka's Avatar

    Forgot to add a link to the website: http://neranera.com is the website with the problem.

  2. Support Staff 2 Posted by Dmitry Semenov on 07 Jul, 2013 06:55 PM

    Dmitry Semenov's Avatar

    Hi,

    You may call the playVideo public methods in rsAfterSlideChange event, please show me the code that you're adding and I'll check what's wrong with it. http://dimsemenov.com/plugins/royal-slider/documentation/#api

    Thanks.

    Dmitry

  3. 3 Posted by luka on 08 Jul, 2013 08:16 AM

    luka's Avatar

    Thank you for your reply. This got me up to the point that I could click on one youtube thumbnail - and it would play. But clickin on another one - no.

    http://neranera.com/js/onload.js

    This is the link to the js that handles the preview. And you can see how this was implemented.

  4. Support Staff 4 Posted by Dmitry Semenov on 09 Jul, 2013 07:00 AM

    Dmitry Semenov's Avatar

    You just need such code if you wish every slider on page to autoplay after slide is changed:

    jQuery('.royalSlider').each(function($) {
    
        var slider = $(this).data('royalSlider');
        slider.ev.on('rsAfterSlideChange', function() {
            slider.playVideo();
        });
    });
    

    Dmitry

  5. 5 Posted by danil on 26 Jul, 2013 01:33 PM

    danil's Avatar

    Where to put this code?

  6. Support Staff 6 Posted by Dmitry Semenov on 26 Jul, 2013 08:56 PM

    Dmitry Semenov's Avatar

    @Danil, you may put this code after the slider initialization code.

    Dmitry

  7. 7 Posted by nhi on 06 Nov, 2013 07:55 PM

    nhi's Avatar

    slider.ev.on('rsBeforeAnimStart', function(event) {
        slider.stopVideo();
      });
      
      slider.ev.on('rsAfterSlideChange', function() {
         slider.playVideo();
      });

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:

»

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac