starkbr
starkbr

Reputation: 229

pauseOnHover and Duration not working on carouFredSel

This is the weirdest thing I've see on my life.

Everything works except two things: pauseOnHover and Duration.

This is my code:

<script type="text/javascript" language="javascript">
    $(function() {
        $('#slide-topo').carouFredSel({
            auto: true,
            prev: '#prev',
            next: '#next',
            mousewheel: false,
            items: {
                pauseOnHover: true,
                width: 1000,
                height: 498
            }
        });
        $('#slide-brands').carouFredSel({
            auto: false,
            prev: '#prevb',
            next: '#nextb',
            items: {
                width: 180,
                height: 115,
                minimum: 2
            }
        });
});
</script>

The "slide-brands" works fine but "slide-topo" doesn't work the pauseOnHover (it doesn't pause on hover) or neither the duration (I removed the original code but was included between "items: {"

The website address: http://www.realnet.com.br/

What I need is:

pauseOnHover to be truly true and a duration set to 4s (4000ms?!), so the slide can "stop" for 4 seconds and then move to the next one.

Thanks, Yeltsin

Upvotes: 3

Views: 3739

Answers (1)

starkbr
starkbr

Reputation: 229

I'm dumb and I solved.

The problem is, I didn't put in the right section!

See the code corrected.

<script type="text/javascript" language="javascript">
            $(function() {
                $('#slide-topo').carouFredSel({
                    auto: true,
                    prev: '#prev',
                    next: '#next',
                    items: {
                        width: 1000,
                        height: 498
                    },
                    scroll: {
                        pauseOnHover: true,
                        duration: 3000,
                    }
                });
                $('#slide-brands').carouFredSel({
                    auto: false,
                    prev: '#prevb',
                    next: '#nextb',
                    items: {
                        width: 180,
                        height: 115,
                        minimum: 2
                    }
                });
            });
        </script>

Upvotes: 3

Related Questions