How to use jCarousel with PHP function? - php

Question

I'm still learning both PHP and jQuery, and this seems to me to be a reasonably complex thing to try and do.
What I'd like to be able to do is use jCarousel's textscroller capability to display a list of URLs generated by a PHP function rather than the XML feed and URLs that jCarousel is written for. (Demo: http://sorgalla.com/projects/jcarousel/examples/special_textscroller.html)
The WordPress PHP function I want to use generates a list of URLs with some html markup for some or all posts in a WordPress category.
As a result, I think I don't need jCarousel's XML function or the html creator function, and I don't need to truncate strings.
So, is it possible to include the PHP function in the jQuery function, or would I have the jQuery function retrieve the URL list from the PHP function, something similar to providing a XML feed to jCarousel? Do I need to use the jQuery-PHP library? http://jquery.hohli.com
Any answers will be appreciated. - Mark
This are the jCarousel functions that use the XML feed: (I omitted document ready function)
function mycarousel_initCallback(carousel, state)
{
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>'+$('title', item).text()+'</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;
};
And this WordPress PHP function:
<?php $my_query = new WP_Query('category_name=mycategory&showposts=10'); ?><?php while ($my_query->have_posts()) : $my_query->the_post(); ?><?php the_title(); ?><br /><br /><?php endwhile; ?>
generates html like this:
link title<br /><br />link title<br /><br />, etc....
which is the html I'd like the jCarousel text scroller to display.

Answer 1

you seem to be missing the actual call to start the carousel
the html needs to be wrapped in a div
<div id="mycarousel">
link title<br /><br />
link title<br /><br />, etc....
</div>
then call
jQuery('#mycarousel').jcarousel({
vertical: true,
size: 0,
initCallback: mycarousel_initCallback
});

Answer 2

in
function mycarousel_initCallback(carousel, state){
carousel.lock();
jQuery.get(
'special_textscroller.php',
{
'feed': 'http://jquery.com/blog/feed/atom/'
},
function(xml) {
mycarousel_itemAddCallback(carousel, xml);
},
'xml'
);};
this method you need to put your WP-php file name in place of "special_textscroller.php"
file or can change the "special_textscroller.php" with your WP function .
Again , you need to send output via XML format only if you do not want to change other "jCarousel" functions.