Xhynk
Xhynk

Reputation: 13840

How to pause this Jquery slider?

I have been struggling with this for ever and it's making me pull my hair out!

http://webdesignsalemoregon.com/westernmennoniteschool/

I've got a slider on this home page and I'm trying to figure out how to add a "click to pause" feature to it. (and perhaps a click to resume too, haha)

I believe this is the code generating the slider

    var $featured_content = jQuery('#featured #slides'),
    et_featured_slider_auto = jQuery("meta[name=et_featured_slider_auto]").attr('content'),
    et_featured_auto_speed = jQuery("meta[name=et_featured_auto_speed]").attr('content');

if ($featured_content.length){
    var et_featured_options = {
        timeout: 2000,
        speed: 500,
        cleartypeNoBg: true,
        prev:   '#featured a#featured-left', 
        next:   '#featured a#featured-right',
        pager:  '#controllers',
    }
    if ( et_featured_slider_auto == 1 ) et_featured_options.timeout = et_featured_auto_speed;

    $featured_content.cycle( et_featured_options );
}

Then I've added a simple button with ID="pauseButton" and put it above the slider. I've also got this code for that button

$('#pauseButton').click(function() {
$featured_content.cycle('pause');
});

But it doesn't actually pause the slideshow? I believe it's using the cycle plugin from http://jquery.malsup.com/cycle/ and I pulled the pause code from http://jquery.malsup.com/cycle/pause.html

Where am I going wrong?!

Upvotes: 0

Views: 1355

Answers (1)

Kevin B
Kevin B

Reputation: 95030

Your script is using jQuery.noConflict(), that causes the $ variable to be reverted back to what it was before jQuery was included. Try replacing all occurences of $() with jQuery().

jQuery('#pauseButton').click(function() {
    $featured_content.cycle('pause');
});

Upvotes: 1

Related Questions