如何使用jCarousel与PHP功能?

时间:2022-05-24 07:42:05

I'm still learning both PHP and jQuery, and this seems to me to be a reasonably complex thing to try and do.

我还在学习PHP和jQuery,这对我来说似乎是一件相当复杂的事情。

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)

我希望能够做的是使用jCarousel的textscroller功能来显示由PHP函数生成的URL列表,而不是为jCarousel编写的XML feed和URL。 (演示: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.

我想要使​​用的WordPress PHP函数为WordPress类别中的部分或全部帖子生成带有一些html标记的URL列表。

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.

因此,我认为我不需要jCarousel的XML函数或html创建函数,我不需要截断字符串。

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

那么,是否可以在jQuery函数中包含PHP函数,或者我是否可以使用jQuery函数从PHP函数中检索URL列表,类似于向jCarousel提供XML提要?我需要使用jQuery-PHP库吗? 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)

这是使用XML提要的jCarousel函数:(我省略了文档就绪函数)

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><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;
};

And this WordPress PHP function:

而这个WordPress PHP功能:

<?php $my_query = new WP_Query('category_name=mycategory&showposts=10'); ?><?php while ($my_query->have_posts()) : $my_query->the_post(); ?><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a><br /><br /><?php endwhile; ?>

generates html like this:

像这样生成html:

<a href="URL" rel="bookmark">link title</a><br /><br /><a href="URL" rel="bookmark">link title</a><br /><br />,  etc....

which is the html I'd like the jCarousel text scroller to display.

这是html我想要显示的jCarousel文本滚动条。

2 个解决方案

#1


you seem to be missing the actual call to start the carousel

你似乎错过了启动旋转木马的实际调用

the html needs to be wrapped in a div

html需要包含在div中

<div id="mycarousel"> 
   <a href="URL" rel="bookmark">link title</a><br /><br />
   <a href="URL" rel="bookmark">link title</a><br /><br />,  etc....
</div> 

then call

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

#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 .

您需要将此WP-php文件名替换为“special_textscroller.php”文件,或者使用WP函数更改“special_textscroller.php”。

Again , you need to send output via XML format only if you do not want to change other "jCarousel" functions.

同样,只有在您不想更改其他“jCarousel”函数时,才需要通过XML格式发送输出。

#1


you seem to be missing the actual call to start the carousel

你似乎错过了启动旋转木马的实际调用

the html needs to be wrapped in a div

html需要包含在div中

<div id="mycarousel"> 
   <a href="URL" rel="bookmark">link title</a><br /><br />
   <a href="URL" rel="bookmark">link title</a><br /><br />,  etc....
</div> 

then call

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

#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 .

您需要将此WP-php文件名替换为“special_textscroller.php”文件,或者使用WP函数更改“special_textscroller.php”。

Again , you need to send output via XML format only if you do not want to change other "jCarousel" functions.

同样,只有在您不想更改其他“jCarousel”函数时,才需要通过XML格式发送输出。