mootools div scrolling in & out script - please help

[MZ]

Hello!

I have created a web page where I used a script:

http://mootools.net/

which let me scroll in and scroll out the <div>`s
I have many div`s which have your own id`s which I can scroll in and scroll out
just using mootools script.
Unfortunately I have many <div>`s which have such scrolling (in & out)
possiblity, that`s why I would like to have viewbale only the main categories

I have such page:

* main category 1 (link: scroll in, link: scroll out)
a. subcategory 1 of main category 1
b. subcategory 2 of main category 1
* main category 2 (link: scroll in, link: scroll out)
a. subcategory 1 of main category 2
* main category 3 (link: scroll in, link: scroll out)
a. subcategory 1 of main category 3
b. subcategory 2 of main category 3

I would like to have such page on the start (just after loaded):

* main category 1 (link: scroll in, link: scroll out) - subcategories are
scrolled in, subcategories are viewable after scrolling out
* main category 2 (link: scroll in, link: scroll out) - the same way as
category 1
* main category 3 (link: scroll in, link: scroll out) - the same way as
category 1

<ul>
<li>
<a href="index.php?menu_typ=szukaj&amp;id_kategorii=110" class="box"
target="_blank">Akcesoria GSM</a> (1)

<script type="text/javascript">

window.addEvent('domready', function()
{
//-vertical

var mySlide = new Fx.Slide('kategoria_div_0');

$('slidein_0').addEvent('click', function(e){
e = new Event(e);
mySlide.slideIn();
e.stop();
});

$('slideout_0').addEvent('click', function(e){
e = new Event(e);
mySlide.slideOut();
e.stop(); });

});
</script> <a id="slidein_0" href="#" style="color:white;"><i>rozwiñ</i></a> <a
id="slideout_0" href="#" style="color:white;"><i>zwiñ</i></a>
<div id="kategoria_div_0">
<ul>
<li>
<a href="index.php?menu_typ=szukaj&amp;id_kategorii=111" class="box"
target="_blank">telefony</a> (1)
<li>others
</ul>
</div>
etc.Do you know how to do that with using http://mootools.net/I will be very
grateful for helpMarcin from Poland