Hi, I am trying to add pause / play button for the animation. I cou

Something like that :) <div class="highlight highlight-source-js notranslate posit

Pause / Play Button about vegas HOT 3 CLOSED

jaysalvat commented on July 29, 2024

Pause / Play Button

from vegas.

Comments (3)

noussh commented on July 29, 2024

I got it working.. Code looks ugly.. Is there a better way of doing it.

$( function() {

$("#start-animation").hide();

$("#stop-animation").click(function() {
  $.vegas('pause'); 
  $("#stop-animation").hide();
  $("#start-animation").show();
});


$("#start-animation").click(function() {

$.vegas( 'slideshow', {
        delay: 8000,
        backgrounds: [
            { src: 'images/background4.jpg', fade: 10000 },
            { src: 'images/background3.jpg', fade: 10000 },
            { src: 'images/background2.jpg', fade: 10000 },
            { src: 'images/background1.jpg', fade: 10000 }
        ]
    } )( 'overlay' );

  $("#start-animation").hide();
  $("#stop-animation").show();

});

$.vegas( 'slideshow', {
        delay: 8000,
        backgrounds: [
            { src: 'images/background4.jpg', fade: 10000 },
            { src: 'images/background3.jpg', fade: 10000 },
            { src: 'images/background2.jpg', fade: 10000 },
            { src: 'images/background1.jpg', fade: 10000 }
        ]
    } )( 'overlay' );
});

from vegas.

jaysalvat commented on July 29, 2024

Something like that :)

$(function() {
    function vegasPlay() {
        $.vegas( 'slideshow', {
            delay: 8000,
            backgrounds: [
                { src: 'images/background4.jpg', fade: 10000 },
                { src: 'images/background3.jpg', fade: 10000 },
                { src: 'images/background2.jpg', fade: 10000 },
                { src: 'images/background1.jpg', fade: 10000 }
            ]
        } )( 'overlay' );
    }

    function vegasPause() {
        $.vegas('pause'); 
    }

    $("#stop-animation").click(function() {
        vegasPause();
        $(this).hide();
        $("#start-animation").show();
    });

    $("#start-animation").click(function() {
        vegasPlay();
        $(this).hide();
        $("#stop-animation").show();
    });

    vegasPlay();
});