Grow your CSS skills. Land your dream job.

How to make this scroll up or down

  • # June 29, 2012 at 8:52 am

    I’m using this news ticker feed that scrolls right to left. I’m trying to get it to scroll up instead. How can I achieve this?

    $(function() {
    $('#ticker-1').carouFredSel({
    width: 1000,
    align: false,
    items: {
    width: 'variable',
    height: 35,
    visible: 1
    },
    scroll: {
    delay: 1000,
    easing: 'linear',
    items: 1,
    duration: 0.07,
    pauseDuration: 0,
    pauseOnHover: 'immediate'
    }
    });

    $('#ticker-2').carouFredSel({
    width: 1000,
    align: false,
    circular: false,
    items: {
    width: 'variable',
    height: 35,
    visible: 2
    },
    scroll: {
    delay: 1000,
    easing: 'linear',
    items: 1,
    duration: 0.07,
    pauseDuration: 0,
    pauseOnHover: 'immediate'
    }
    });

    // set carousels to be 100% wide
    $('.caroufredsel_wrapper').css('width', '100%');

    // set a large width on the last DD so the ticker won't show the first item at the end
    $('#ticker-2 dd:last').width(2000);
    });
    # June 29, 2012 at 1:19 pm

    Try adding:
    direction: 'up' or direction: 'down' to your configuration.

    Src: http://caroufredsel.frebsite.nl/configuration.php

    # July 5, 2013 at 10:00 am

    Hi,

    I’m using the same code for my website.

    Do you know how can I put a link on the ticker ?

    # July 5, 2013 at 10:29 am

    I just noticed .. this ticker is not scrolling if is loaded as an iFrame, could you please help me to fix that ?

    Regarding the link I solved the problem.

    Thanks,

    # July 5, 2013 at 10:34 am

    Perhaps you could share a link to a live site?

    # July 5, 2013 at 10:52 am

    I was talking too fast.. problem solved. It’s working perfectly as iframe.

    I was loading the wrong js file on the server and the scroll didn’t work. :))

    Thanks

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".