2

I am using a jQuery plugin for a website and I'm not the best at javascript. What in this code keeps making the script loop and where can I stop it? I am not sure where/if it is coming from this script or if I should be looking somewhere else...

    jQuery(function( $ ){   
    var $slideshow = $('#slideshow');
    var $homeslidernav = $('#navigation li button');
    var $prev = $('button.prev');
    var $next = $('button.next');
    $('#welcome h1').lettering();
    var intval = 7200;
    function ResetFunction() {
        TweenMax.killAll(true, false, true); 
    };
    function Slide1Function() {
        var Slide1 = new TimelineMax();         
        $('#section1').append([
            Slide1.to( $('.head_animation'), .2, {css:{display: 'block', opacity: '1'}}),
            Slide1.to( $('.head2_animation'), .2, {css:{ display: 'block', opacity: '1'}}),
            Slide1.from( $('.head2_animation'), 1.8, {css:{ top: '300px'}, ease:Expo.easeInOut}, -1.5),
            Slide1.from( $('.head_animation .char1'), .25, {css:{top: '-200px', right:'1000px'}, ease:Elastic.easeOut}),
            Slide1.from( $('.head_animation .char2'), .25, {css:{top: '300px', right:'1000px'}, ease:Elastic.easeOut}),
            Slide1.from( $('.head_animation .char3'), .25, {css:{top: '-400px', right:'1000px'}, ease:Elastic.easeOut}),
            Slide1.from( $('.head_animation .char4'), .25, {css:{top: '-200px', left:'1000px'}, ease:Elastic.easeOut}),
            Slide1.from( $('.head_animation .char5'), .25, {css:{top: '200px', left:'1000px'}, ease:Elastic.easeOut}),
            Slide1.from( $('.head_animation .char6'), .25, {css:{top: '-200px', left:'1000px'}, ease:Elastic.easeOut}),
            Slide1.from( $('.head_animation .char7'), .25, {css:{top: '200px', left:'1000px'}, ease:Elastic.easeOut}),

            Slide1.from( $('.head_animation .char1'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}}),
            Slide1.from( $('.head_animation .char2'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}}),
            Slide1.from( $('.head_animation .char3'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}}),
            Slide1.from( $('.head_animation .char4'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}}),
            Slide1.from( $('.head_animation .char5'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}}),
            Slide1.from( $('.head_animation .char6'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}}),
            Slide1.from( $('.head_animation .char7'), .3, {css:{color: '#4f3f35', fontFamily: 'MenschBold'}})       
        ]);
    };
    $slideshow.serialScroll({
        target:'#sections',
        items:'li.slide',
        prev: $prev,
        next: $next,
        axis:'xy',
        navigation: $homeslidernav,
        interval:intval,
        duration:0,
        force:true,
        constant:false,
        onBefore:function( e, elem, $pane, $items, pos ){
            $homeslidernav.removeClass('active');
            $homeslidernav.removeAttr("disabled"); 
            $homeslidernav.eq(pos).addClass('active');
            $homeslidernav.eq(pos).attr("disabled", "disabled");
            $('#sections li.slide').removeClass('first'); 
            $('#sections li.slide').removeClass('current'); 
            $('#sections li.slide').eq(pos).addClass('current');
            if($('#section1.current').length > 0) {
                Slide1Function();
            }
            else {
                ResetFunction();
                $('.head_animation').css({'display': 'none', 'opacity':'0'});
                $('.head2_animation').css({'display': 'none', 'opacity':'0'});
            };
            e.preventDefault();
            if( this.blur )
                this.blur();
        },
        onAfter:function( elem ){
            if($('#section1.first').length > 0) {
                Slide1Function();
            }
        }
    });

});
cdheiden
  • 23
  • 2
  • 3
    Nothing jumps out at me. Try some good olde fashioned debugging by commenting out lines and or blocks to help pinpoint the source of the problem. – Jared Feb 22 '13 at 21:30
  • Which jQuery plugins do you use? Please link/tag them. Also I think you actually should use some loops for parts of your code as a start. – Bergi Feb 22 '13 at 21:33
  • Looks like he's using [this SerialScroll plugin](http://flesler.blogspot.com/2008/02/jqueryserialscroll.html). But without the option `cycle: true` it shouldn't loop. – Barmar Feb 22 '13 at 21:37
  • Any chance you can give us a link to the site? – Jared Feb 22 '13 at 21:43

1 Answers1

1

It looks like from the doc that @Barmar posted, that the serialScroll has start and stop properties. Without seeing the rest of your code, including how your implementing, it's hard to say. But I'm guessing that the force: true is forcing it to start, but you are not calling stop.serialScroll anywhere

start.serialScroll (Re)starts autoscrolling
stop.serialScroll Stops the autoscrolling
Ryan
  • 5,644
  • 3
  • 38
  • 66