Start autoplay on javascript event

Resolved ald0413
(@ald0413)

9 years, 3 months ago
Hi,

Thanks again for the great plugin. I was wondering how I can trigger autoplay by a javascript/jquery event, such as onclick or onmouseover of another element.

Something along the lines of:
```
$('#element).click(function(){
    $('.meta-slider').play();
});
```
‘

Thank you!!

Viewing 5 replies - 1 through 5 (of 5 total)

(@matchalabs)

Hi there,

Try this, change the slider ID to match your slider:

$('#element').click(function(){
    $('#metaslider_123').flexslider('start');
});

Thanks,
Dave

This reply was modified 9 years, 3 months ago by matchalabs.

Thread Starter

ald0413

(@ald0413)

9 years, 3 months ago

Hi, I tried both

$('#element').click(function(){
    $('#metaslider_61').flexslider('start');
});

and

$('#element').click(function(){
    $('#metaslider_61').flexslider('play');
});

Neither worked, but neither is throwing an error, either.

The inline javascript generated by metaslider is as follows:

var metaslider_61 = function($) {
            $('#metaslider_61').addClass('flexslider'); // theme/plugin conflict avoidance
            $('#metaslider_61').flexslider({ 
                slideshowSpeed:3000,
                animation:"slide",
                controlNav:true,
                directionNav:false,
                pauseOnHover:true,
                direction:"horizontal",
                reverse:false,
                animationSpeed:1000,
                prevText:"<",
                nextText:">",
                easing:"easeInQuad",
                slideshow:false,
                useCSS:false
            });
        };
        var timer_metaslider_61 = function() {
            var slider = !window.jQuery ? window.setTimeout(timer_metaslider_61, 100) : !jQuery.isReady ? window.setTimeout(timer_metaslider_61, 1) : metaslider_61(window.jQuery);
        };
        timer_metaslider_61();

I’m using jQuery 3.1.0

Thank you!

This reply was modified 9 years, 3 months ago by ald0413.

matchalabs

(@matchalabs)

9 years, 3 months ago

Hi there,

Do you have a link to the page with the slider and trigger?

Thanks,
Dave

Thread Starter

ald0413

(@ald0413)

9 years, 3 months ago

Hi Dave,

I’ve put up a beta site here: http://smmcnyc.com/work/FHF/beta/

I’ve separated out the js into an unminified file galleries.js in theme folder

Thanks

matchalabs

(@matchalabs)

9 years, 3 months ago

Hi,

Thanks for the link.

$('#metaslider_61').flexslider('play'); is successfully playing the slider when executed in the console so the issue will be with the trigger itself.

You may also want to look at adding the script via a filter. Here’s a simple example that you would need to add to your theme’s functions.php file:

function metaslider_flex_js($javascript, $slider_id) {
    $javascript .= "$('#metaslider_61').flexslider('play');";
 
    return $javascript;
}
add_filter('metaslider_flex_slider_javascript', 'metaslider_flex_js', 10, 2);

Thanks,
Dave

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Start autoplay on javascript event’ is closed to new replies.