if someone need it, I made it tonight :-)
index.php of the template
PHP Code:
// make rolloverimages for menu (remove "old" $mymenu_rows!!!)
$database->setQuery("SELECT * FROM #__menu WHERE menutype = 'mainmenu' AND published ='1' AND parent = '0' ORDER BY ordering");
$mymenu_rows = $database->loadObjectList();
$mymenu_content = "";
$i="0";
foreach($mymenu_rows as $mymenu_row) {
$i++;
// akede, 2004-03-04: Support for multi language component MambelFish added
if ($mosConfig_mbf_content) {
$mymenu_row = MambelFish::translate( $mymenu_row, 'menu', $mosConfig_lang);
}
// END: akede
// print_r($mymenu_rows);
$mymenulink = $mymenu_row->link;
if ($mymenu_row->type != "url") {
$mymenulink .= "&Itemid=$mymenu_row->id";
}
if ($mymenu_row->type != "separator") {
$mymenu_content .= "<div class=\"cssnav".$i."\"><a href=\"".sefRelToAbs($mymenulink)."\"><img src=\"".$mosConfig_live_site."/templates/duckrace/images/nav_".$i.".gif\"></a></div>";
}
}
// make the css for the menu-rollover-images
$k="1";
while ($k <= $i){
if ($k =="1") {
echo "<style type=\"text/css\">";
}
?>
.cssnav<? echo $k;?> {
position:relative;font-family: arial, verdana, helvetica, sans-serif;
background-image: url(/templates/duckrace/images/nav_<? echo $k;?>_on.gif);
background-repeat: no-repeat;display: block;
width: 116px;height: 30px;margin: 0; margin-bottom:0px;padding: 0;
}
.cssnav<? echo $k;?> a {
display:block;
font-size: 11px;
width: 116px;
height: 30px;display: block;
float: left;margin: 0;
padding: 0;color: black;
text-decoration: none;
}
.cssnav<? echo $k;?> img { width: 100%; height: 100%; border: 0;}
* html a:hover {visibility:visible}
.cssnav<? echo $k;?> a:hover img{visibility:hidden}
.cssnav<? echo $k;?> span {
position:absolute;
left:5px;
top:3px;
margin:0;
cursor: hand;
}
<?
$k++;
}?>
</style></head><body>
<?php echo $mymenu_content ?>
....
</body></html>
insert images "nav_1.gif nav_1_on.gif nav_2.gif nav_2_on.gif ......" in the images dir of the template
have fun....
Rollovermenu with images 
Linear Mode
