Question

hey I have two functions, I have a slider with some deep linking. There is a carousel that pairs up with the slider and when the slider moves to the next slide the event prompts the carousel to move to the next slide and switch classes. The problem is when you load the page with the deep link there is no event, so it doesn’t highlight a thumb, so I have two seperate functions, they seem repetitive and I was wondering if there was a way to combine them?

$(function() {
    if(portfolio_slide_TOTAL.currSlideId == 4) {
        // your code here!
        $('#portfolio_carousel_thumbs').data('touchCarousel').goTo(4);
        $("#color_goto").addClass("library_thumb_active");
    }
});
$(function() {
    portfolio_slide_TOTAL.ev.on('rsAfterSlideChange', function() {
        if(portfolio_slide_TOTAL.currSlideId == 4) {
            // your code here!
            $('#portfolio_carousel_thumbs').data('touchCarousel').goTo(4);
        }
    });
});

Answer 1

Try :

$(function() {
    var flag=true;
    test_slide(); //runs first

    portfolio_slide_TOTAL.ev.on('rsAfterSlideChange', test_slide);

    function test_slide() {
        if(portfolio_slide_TOTAL.currSlideId == 4) {
            // your code here!
            $('#portfolio_carousel_thumbs').data('touchCarousel').goTo(4);
            if (flag) {
                $("#color_goto").addClass("library_thumb_active"); //only on first
                flag=false; //set flag to false after first run
            }
        }

    }
});    ​