WordPress.org

Support

Support » Plugins and Hacks » Easing Slider » [Resolved] Stop on hover

[Resolved] Stop on hover

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author MatthewRuddy

    @matthewruddy

    Should be possible using some custom JS. For pause on hover, add this to your theme’s header.php before the </head>:

    <script type="text/javascript">
    jQuery(document).ready(function($) {
        $('.easingsliderlite').on('mouseenter', function() {
            $('.easingsliderlite').data('easingsliderlite').startPlayback();
        });
        $('.easingsliderlite').on('click', function() {
            $('.easingsliderlite').data('easingsliderlite').endPlayback();
        });
    });
    </script>

    For ending playback after your slideshow has cycled through all of the slides, use this code:

    <script type="text/javascript">
        jQuery(document).ready(function($) {
            var inc = 0;
            $('.easingsliderlite').data('easingsliderlite').$el.on('nextslide', function() {
                inc++;
                if (inc == $('.easingsliderlite').data('easingsliderlite').count) {
                     $('.easingsliderlite').data('easingsliderlite').endPlayback();
                }
            });
        });
    </script>

    Hope these do the trick 🙂

    I tried this code for pause on hover, but its not working. So I changed it little bit to make it work for me.

    <script type=”text/javascript”>
    jQuery(document).ready(function($) {
    $(‘.easingsliderlite’).on(‘mouseenter’, function() {
    $(‘.easingsliderlite’).data(‘easingsliderlite’).endPlayback();
    });
    $(‘.easingsliderlite’).on(‘mouseleave’, function() {
    $(‘.easingsliderlite’).data(‘easingsliderlite’).startPlayback();
    });
    });
    </script>

    Plugin Author MatthewRuddy

    @matthewruddy

    Just to update everyone, the code I pasted previously was incorrect. As the post is old I’m unable to edit it. Here is the code you should be using for pause on hover.

    jQuery(document).ready(function($) {
        $('.easingsliderlite').on('mouseenter', function() {
            $('.easingsliderlite').data('easingsliderlite').resumePlayback();
        });
        $('.easingsliderlite').on('mouseleave', function() {
            $('.easingsliderlite').data('easingsliderlite').pausePlayback();
        });
    });

    I have added this code to the header. It still plays on hover. http://www.brydgespropertymanagement.com/dev/

    jQuery(document).ready(function($) {
        $('.easingsliderlite').on('mouseenter', function() {
            $('.easingsliderlite').data('easingsliderlite').resumePlayback();
        });
        $('.easingsliderlite').on('mouseleave', function() {
            $('.easingsliderlite').data('easingsliderlite').pausePlayback();
        });
    });

    EDIT: I changed to itflexdemo’s code and it is now pausing on hover.

    Plugin Author MatthewRuddy

    @matthewruddy

    Yup, I’d made another mistake – my head is all over the place! Apologies to everyone!

    Here’s the code:

    jQuery(document).ready(function($) {
        $('.easingsliderlite').on('mouseenter', function() {
            $('.easingsliderlite').data('easingsliderlite').pausePlayback();
        });
        $('.easingsliderlite').on('mouseleave', function() {
            $('.easingsliderlite').data('easingsliderlite').resumePlayback();
        });
    });

    Thank You Matthew!! 😀

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Resolved] Stop on hover’ is closed to new replies.
Skip to toolbar