Different Banner scroller on each Category page

So on my home page there is a jquery image scroller (fading in and out of different products). I'd like to have a similar image scroller on each of the seven (7) category pages. Naturally, each category page needs to have different images pertaining to that category.

I understand I can style each Category page differently using CSS callouts for each page (cat_1.css, cat_2.css etc). I can't wrap my head around how I'd install a jquery scroller on each page.

I have noticed that each Category page URL ends differently (...path=41, path=42, path=43, etc.) Can I somehow target each .php and install seven different scrollers? I understand that there is really only one Category template .php.

Hope this makes sense.

Thanks.

btw- I have a cursory knowledge of PHP at the moment. Although I've just started to dive in.

Yes, but this may be beyond the scope of a forum post.

It depends a little on which jQuery scroller you are using and how that installs on the page.

But the starting point about thinking about it would be to use a conditional statement that looks something like:

if(isset($_GET['cPath']) and $_GET['cPath']!='')
{
    switch($_GET['cpath'])
    {
        case '32' :
            // put the code for category 32 in here
        break;
        
        case '33' :
            // put the code for category 33 in here
        break;

        default :
            // put the default code in here
        break;

    }
}

And a variant of that would probably go in tpl_index_categories.php. As I have typed this off the top of my head you'd need to check for typos. ( http://www.tizag.com/phpT/switch.php )

Depending on how complex all this gets it may well be better to put it all in it's own file and just include that file into tpl_index_categories

have you tried putting the code in each of the categories description, each calling the slider you want,

so i use

http://www.kerrinhardy.com/2011/02/16/step-by-step-guide-to-installing-easy-slider-1-7-in-zen-cart/

and if i put code in this particular example

<!-- bof Easy Slider 1.7 -->
<div id="container">
    <div id="content">
        <div id="slider">
            <ul>
                <li><a href="#"><img alt="Easy Slider 1.7 for Zen Cart" src="includes/templates/classic/images/slider1.jpg" /></a>
                <li><a href="#"><img alt="Easy Slider 1.7 for Zen Cart" src="includes/templates/classic/images/slider2.jpg" /></a>
                <li><a href="#"><img alt="Easy Slider 1.7 for Zen Cart" src="includes/templates/classic/images/slider3.jpg" /></a>
                <li><a href="#"><img alt="Easy Slider 1.7 for Zen Cart" src="includes/templates/classic/images/slider4.jpg" /></a>
            </li></ul>
        </div>
    </div>
</div>
<!-- eof Easy Slider 1.7 -->

into the categories description it seems to work fine, you may need extra css if the slider in the categories is different size to the slider on home page

hope this works for you

bryan