The main page is, http://sorgalla.com/projects/jcarousel/ and what I'm trying to do is the text scrolling box
http://sorgalla.com/projects/jcarousel/examples/special_textscroller.html

I can set it up fine, it's just the example/codes given are for setting up the input to come from an RSS feed, and I just want to use it to scroll/display a description in some of my nodes since some are excessively long. So I'm having trouble converting the functions to just display my static text. Here's the original code.

function mycarousel_initCallback(carousel, state)
{
    // Lock until all items are loaded. That prevents jCarousel from
    // setup correctly and we have to do that in the ajax callback
    // function with carousel.setup().
    // We're doing that because we don't know the exact height of each
    // items until they are added to the list.
    carousel.lock();

    jQuery.get(
        'special_textscroller.php',
        {
            'feed': 'http://jquery.com/blog/feed/atom/'
        },
        function(xml) {
            mycarousel_itemAddCallback(carousel, xml);
        },
        'xml'
    );
};

function mycarousel_itemAddCallback(carousel, xml)
{
    var $items = jQuery('item', xml);

    $items.each(function(i) {
        carousel.add(i + 1, mycarousel_getItemHTML(this));
    });

    carousel.size($items.size());

    // Unlock and setup.
    carousel.unlock();
    carousel.setup();
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    return '<h3><a href="'+$('link', item).text()+'">'+$('title', item).text()+'</a></h3><p>'+mycarousel_truncate($('description', item).text(), 90)+'</p>';
};

/**
 * Utility function for truncating a string without breaking words.
 */
function mycarousel_truncate(str, length, suffix) {
    if (str.length <= length) {
        return str;
    }

    if (suffix == undefined) {
        suffix = '...';
    }

    return str.substr(0, length).replace(/\s+?(\S+)?$/g, '') + suffix;
};

jQuery(document).ready(function() {
    /**
     * We show a simple loading indicator
     * using the jQuery ajax events
     */
    jQuery().ajaxStart(function() {
        jQuery(".jcarousel-clip-vertical").addClass('loading');
    });

    jQuery().ajaxStop(function() {
        jQuery(".jcarousel-clip-vertical").removeClass('loading');
    });

    jQuery('#mycarousel').jcarousel({
        vertical: true,
        size: 0,
        initCallback: mycarousel_initCallback
    });
});

Comments

nevets’s picture

Are you trying to display the text from multiple nodes in the carousel (there are modules for this) or just scroll long descriptions?

christopherareed’s picture

Hey nevets! I'm just trying to figure out a decent way to display long descriptions in a static amount of space so the page doesn't need to be scrolled excessively.

nevets’s picture

I use css on the containing div to set height and overflow to auto. Set height will limit the vertical space, setting overflow to auto will cause a scroll bar to appear if the vertical space is to small for the text.

christopherareed’s picture

Fiiiiine, you win, I wanted to do something different just because, but that will make life easy I suppose. Nevets to the rescue as usual!